创建地图:

//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)

最新文章

  1. C/C++二维数组的用法
  2. hdu4087ALetter to Programmers(三维旋转矩阵)
  3. 通过Maven插件发布JaveEE项目到tomcat下
  4. java中与数据库的连接
  5. JS案例之7——瀑布流布局(2)
  6. mint锁屏设置
  7. 排序算法 Java实现版
  8. js接收复选框的值
  9. Ibatis根据id获取拼接好的sql语句案例
  10. 二、VueJs 填坑日记之基础项目构建
  11. 深入.NET数据类型(1)
  12. [LeetCode] 10. 正则表达式匹配
  13. 转【微信小程序 四】二维码生成/扫描二维码
  14. 8.css内容移出与精灵图
  15. wordpress搭建博客上传begin主题The themes is locked to another domain
  16. SNAT DNAT MASQUERADE 区别
  17. C# 委托、匿名方法、扩展方法
  18. 常见的接口与类 -- Comparator
  19. C++复习6.C/C++高级数据类型
  20. 测试模拟 白屏 / FOUC

热门文章

  1. CAS 5.3.x 相关信息
  2. Null Hypotheses| Alternative Hypotheses|Hypothesis Test|Significance Level|two tailed |one tailed|
  3. @echo off 批处理
  4. Django中查询相关操作
  5. Spark和Hadoop MapReduce之间的比较
  6. CHI 2015大会:着眼于更加个性化的人机交互
  7. JAVA 截图+tess4j识别
  8. 849. Dijkstra求最短路 I
  9. docker运行mysql主从备份,读写分离
  10. 添砖加瓦:snappy无损压缩算法