OpenLayers 3 之 地图控件(control)

地图控件(control)是指地图上比例尺,缩略图,拉近拉远的按钮,滚动控制条等控件,默认控件有三个,可以禁用。


OpenLayers 3 之 地图控件(control)初始化与定制的代码如下:
var map = new ol.Map({
// 设置地图控件,默认的三个控件都不显示
controls: ol.control.defaults({
attribution: false,
rotate: false,
zoom: false
}),
layers: [
new ol.layer.Tile({
source: new ol.source.OSM()
})
],
target: 'map',
view: new ol.View({
center: ol.proj.transform(
[104, 30], 'EPSG:4326', 'EPSG:3857'),
zoom: 10
})
});

添加控件

//添加属性控件
map.addControl(new ol.control.Attribution());
//添加鼠标定位控件
map.addControl(new ol.control.MousePosition({
undefinedHTML: 'outside',
projection: 'EPSG:4326',
coordinateFormat: function(coordinate) {
return ol.coordinate.format(coordinate, '{x}, {y}', 4);
}
})
);
//添加缩略图控件
map.addControl(new ol.control.OverviewMap({
collapsed: false
}));
//添加旋转控件
map.addControl(new ol.control.Rotate({
autoHide: false
}));
//添加比例尺控件
map.addControl(new ol.control.ScaleLine());
//添加缩放控件
map.addControl(new ol.control.Zoom());
//添加缩放滑动控件
map.addControl(new ol.control.ZoomSlider());
//添加缩放到当前视图滑动控件
map.addControl(new ol.control.ZoomToExtent());
//添加全屏控件
map.addControl(new ol.control.FullScreen());

效果:  

参考自:https://blog.csdn.net/longshengguoji/article/details/46916327

https://blog.csdn.net/yangzhai/article/details/59476325

OpenLayers 3 之 地图控件(control)的更多相关文章

  1. Google地图接口API之地图控件集(五)

    1.默认控件集 当使用一个标准的google地图,它的控件默认设置如下: (1). Zoom-显示一个滑动条来控制map的Zoom级别,如下所示:

  2. 使用XAML在WPF项目中承载ArcGIS Engine地图控件开发

    原文 http://blog.csdn.net/flexmapserver/article/details/5868882 用Windows Form进行ArcGIS Engine二次开发时常见的形式 ...

  3. Corelocation及地图控件学习笔记

    Corelocation基本使用 在地图章节的学习中,首先要学的便是用户位置定位,因此我们首先要掌握Corelocation的使用.(在IOS8以前可以系统会直接请求授权,现在需要我们自己调用方式通知 ...

  4. 线程间操作无效: 从不是创建控件“”的线程访问它~~~的解决方法~ 线程间操作无效: 从不是创建控件“Control Name'”的线程访问它问题的解决方案及原理分析

    看两个例子,一个是在一个进程里设置另外一个进程中控件的属性.另外一个是在一个进程里获取另外一个进程中控件的属性. 第一个例子 最近,在做一个使用线程控制下载文件的小程序(使用进度条控件显示下载进度)时 ...

  5. 如何添加地图控件到Windows Phone 8的页面中

    原文 如何添加地图控件到Windows Phone 8的页面中 本主题介绍了各种方法来添加一个地图控件到Windows Phone 8的项目.该地图控件在Windows Phone的SDK 8.0的库 ...

  6. 【高德地图API】从零开始学高德JS API(二)地图控件与插件——测距、圆形编辑器、鼠标工具、地图类型切换、鹰眼鱼骨

    原文:[高德地图API]从零开始学高德JS API(二)地图控件与插件——测距.圆形编辑器.鼠标工具.地图类型切换.鹰眼鱼骨 摘要:无论是控件还是插件,都是在一级API接口的基础上,进行二次开发,封装 ...

  7. 深入理解最强桌面地图控件GMAP.NET ---离线地图

    enjoyeclipse 深入理解最强桌面地图控件GMAP.NET ---离线地图 这章会介绍GMAP.NET的核心功能之一:离线地图.这个功能可以满足很多政府项目.保密项目.或者由于种种原因不能上网 ...

  8. SkylineGlobe 7.0.1 & 7.0.2版本Web开发 如何正确使用三维地图控件和工程树控件

    Skyline TerraExplorer Pro目前正式发布的7.0.1&7.0.2版本,还只是64位的版本, 在Web开发的时候,如何在页面中正确嵌入三维地图控件,让一些小伙伴凌乱了. 下 ...

  9. 如何屏蔽SkylineGlobe提供的三维地图控件上的快捷键

    SkyllineGlobe提供的 <OBJECT ID=" TerraExplorer3DWindow" CLASSID="CLSID:3a4f9192-65a8- ...

随机推荐

  1. 每天一个linux命令(文件操作):【转载】which命令

    我们经常在linux要查找某个文件,但不知道放在哪里了,可以使用下面的一些命令来搜索:        which  查看可执行文件的位置.       whereis 查看文件的位置.         ...

  2. BZOJ3141 Hnoi2013 游走 【概率DP】【高斯消元】*

    BZOJ3141 Hnoi2013 Description 一个无向连通图,顶点从1编号到N,边从1编号到M. 小Z在该图上进行随机游走,初始时小Z在1号顶点,每一步小Z以相等的概率随机选 择当前顶点 ...

  3. linux 下执行python.py 无效解决方案

    python 下写linux执行脚本 单独执行 python /home/xx.py 运行正常,但是在linux下 crotch -l 发现有任务运行: 30 0 * * *  python /hom ...

  4. 获得消息的x,y的窗口内坐标(包括边框和titlebar高度

    rectWindow = D2D.GetWindowRect(self.hwnd)#窗口大小 rectClient = D2D.GetWindowRect(self.hwnd,True)#客户区大小 ...

  5. traits与Iterator

    traits 这是用traits的详细用法https://www.cnblogs.com/tianzeng/p/9709814.html /** * 用于标记迭代器类型 */ struct input ...

  6. socket编程 —— 非阻塞socket (转)---例子已上传至文件中

    在上一篇文章 <socket编程——一个简单的例子> http://blog.csdn.net/wind19/archive/2011/01/21/6156339.aspx 中写了一个简单 ...

  7. yum命令集

    升级相关命令: yum update : 安装所有更新软件 yum update xxx : 仅更新指定的软件 yum check-update : 列出所有可更新的软件清单 yum list : 列 ...

  8. Spark Streaming性能调优

    数据接收并行度调优(一) 通过网络接收数据时(比如Kafka.Flume),会将数据反序列化,并存储在Spark的内存中.如果数据接收称为系统的瓶颈,那么可以考虑并行化数据接收.每一个输入DStrea ...

  9. Python2 和 Python3 的区别(待完善)

    1.宏观上 python2 :源码不标准,混乱,重复代码太多 python3 :统一 标准,去除重复代码. 2. print python2 :括号可有可无 print(a)  或  print ap ...

  10. jQuery实现清空table表格除首行外的所有数据

    1.其实网上有很多版本,试了好几个都不行,最后还是查到了一个非常方便的:不会清除表格第一行表头部分. 其中J_tab_fam是table的id. ? 1 $("#J_tab_fam  tr: ...