创建地图:
//View对象代表地图的简单2D视图 //创建view let view = new ol.View({ center:[109,34],//视图的初始中心 maxZoom:18,//最大缩放级别 ,默认为28 minZoom:3,//最小缩放级别,默认为0 projection:'EPSG:4326',//坐标格式,默认为'EPSG:3857' rotation:(Math.PI/180)*0,//视图的初始旋转(弧度)(顺时针正旋转,0表示北) zoom:8,//初始视图级别 extent:[107,34,108,36],//限制视图的范围[minLon,minLat,maxLon,maxLat] }) //创建地图 var map = new ol.Map({ view:view, layers: [ new ol.layer.Tile({ source: new ol.source.OSM() }) ], target: 'map', //控件初始默认不显示 controls:ol.control.defaults({ attribution: false, zoom: false }).extend([]) });
动画:
//飞行类型 let Easing = { easeIn:ol.easing.easeIn,//开始缓慢并加快速度 easeOut:ol.easing.easeOut,//快速启动,然后慢下来 inAndOut:ol.easing.inAndOut,//从慢开始,加快速度,然后再次慢下来 linear:ol.easing.linear,//随时间保持恒定的速度 upAndDown:ol.easing.upAndDown,//从慢开始,加快速度,最后再减速 } view.animate({ center:[100,34],//动画结束时视图的中心 zoom:10,//动画结束时视图的缩放级别 rotation:0,//动画结束时视图的旋转 duration:3000,//动画的持续时间(以毫秒为单位) easing:Easing.inAndOut,//动画类型,默认为inAndOut }) //取消正在进行的动画 view.cancelAnimations(); //确定视图是否处于动画状态,返回布尔值 view.getAnimating();
view 常用方法:
//获取-设置,视图中心 view.getCenter() view.setCenter([100,40]) //获取-设置,视图的最大缩放级别 view.getMaxZoom() view.setMaxZoom(16) //获取-设置,视图的最小缩放级别 view.getMinZoom() view.setMinZoom(6) //获取-设置,视图旋转角度 view.getRotation()/(Math.PI/180) view.setRotation((Math.PI/180)*60) //获取-设置,当前缩放级别 view.getZoom() view.setZoom(13) //获取视图投影 view.getProjection() //绑定事件-取消事件 type事件类型,listener函数体 view.on(type,listener) view.un(type,listener)