地图控件
编辑时间:2017-02-03

地图控件概述

山西福彩快乐十分 www.x78jx.cn 百度地图上负责与地图交互的UI元素称为控件。百度地图API中提供了丰富的控件,您还可以通过Control类来实现自定义控件。

地图API中提供的控件有:

Control:控件的抽象基类,所有控件均继承此类的方法、属性。通过此类您可实现自定义控件。

NavigationControl:地图平移缩放控件,PC端默认位于地图左上方,它包含控制地图的平移和缩放的功能。移动端提供缩放控件,默认位于地图右下方。

OverviewMapControl:缩略地图控件,默认位于地图右下方,是一个可折叠的缩略地图。

ScaleControl:比例尺控件,默认位于地图左下方,显示地图的比例关系。

MapTypeControl:地图类型控件,默认位于地图右上方。

CopyrightControl:版权控件,默认位于地图左下方。

GeolocationControl:定位控件,针对移动端开发,默认位于地图左下方。

向地图添加控件

可以使用Map.addControl()方法向地图添加控件。在此之前地图需要进行初始化。例如,要将标准地图控件添加到地图中,可在代码中添加如下内容:

var map = new BMap.Map("allmap");
map.centerAndZoom(new BMap.Point(new BMap.Point(110.1, 35.1), 5);
map.addControl(new BMap.NavigationControl());

可以向地图添加多个控件。在本例中我们向地图添加一个平移缩放控件、一个比例尺控件、一个缩略图、一个地图类型控件。在地图中添加控件后,它们即刻生效。

map.addControl(new BMap.NavigationControl());
map.addControl(new BMap.ScaleControl(ture));
map.addControl(new BMap.OverviewMapControl());
map.addControl(new BMap.MapTypeControl({mapTypes: [BMAP_NORMAL_MAP,BMAP_SATELLITE_MAP]}));//显示电子地图和卫星图

控制控件位置

控件位置偏移

除了指定??课恢猛?,还可以通过偏移量来指示控件距离地图边界有多少像素。如果两个控件的??课恢孟嗤?,那么控件可能会重叠在一起,这时就可以通过偏移值使二者分开显示。

本示例将比例尺放置在地图的左下角,由于API默认会有版权信息,因此需要添加一些偏移值以防止控件重叠。

var opts = {offset: new BMap.Size(150, 5)}
map.addControl(
new BMap.ScaleControl(opts));

   


整体效果:

12.jpg

获取正版授权

方式一:自动授权

关注官方微信号
BIGEMAP微信公众号
操作步骤:
①关注官方微信号
②点击【自助授权】
③按提示完成操作!
注:此功能暂未完成

方式二:点击加入

免费授权QQ群

QQ在线咨询在线客服

免费咨询电话

400-028-7262

山西福彩快乐十分

淘宝店铺

bigemap.taobao.com

联系我们
  • 比肩郭艾伦之人欲联手新疆冲冠?国产助攻王成X因素 2019-06-07
  • 光明日报:救命药岂能一降价就断货 2019-05-29
  • 2017网上群众工作优秀案例 2019-05-24
  • 只要等一等就能多“等”出8600万美元! 2019-05-24
  • 回复@大雨582:任何人的自由发展都是跟他的能力意愿行动及生成的结果平滑对接的。 2019-05-07
  • 印度军用运输机从高原机场起飞 吹起一场沙尘暴 2019-05-07
  • 中小企业板成立14年 累计实现净利润1.25万亿元 2019-05-06
  • 老火靓汤一天中何时喝最好? 2019-04-17
  • 陈晓卿推出全新美食纪录片 "风味"能否再续辉煌? 2019-04-17
  • 詹皇通知骑士队 准备与其续约 2019-04-11
  • 张瑜的专栏作者中国国家地理网 2019-04-10
  • 尧都农商银行全力推进服务“三农”工作 2019-04-09
  • [大笑]那依然是按劳(劳动价值或劳动能力)分配也! 2019-04-09
  • 台花莲发生6.5级地震已致2人遇难 2019-03-28
  • 谋求共同发展的强大动力(钟声) 2019-03-17
  • 420| 318| 794| 86| 612| 555| 422| 583| 483| 742|