控件

地图控件概述

大地图上负责与地图交互的UI元素称为控件。大地图API中提供了丰富的控件,您还可以通过Control类来实现自定义控件。

地图API中提供的控件有:

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

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

向地图添加控件

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

var map = new BigMap.Map("map");
map.centerAndZoom(new BigMap.Point(116.404, 39.915), 10);
var control = new BigMap.NavigationControl();// 左上角,添加默认缩放平移控件
//添加控件
function add_control(){
	map.addControl(control);        
}
//移除控件
function delete_control(){
	map.removeControl(control);     
}

控件平移功能 左上角,添加默认缩放平移控件,具有放大按钮,缩小按钮,向右移动,向左移动,向上移动,向下移动监听事件的功能。

ZOOMIN-ADDEVENTLISTENER 表示放大按钮的点击监听。

ZOOMOUT-ADDEVENTLISTENER 表示缩小按钮的点击监听。

RIGHT-ADDEVENTLISTENER 表示向右移动的点击监听。

LEFT-ADDEVENTLISTENER 表示向左移动的点击监听。

UP-ADDEVENTLISTENER 表示向上移动的点击监听。

DOWN-ADDEVENTLISTENER 表示向下移动的点击监听。

Con1.png


添加/删除地图类型控件

添加/删除地图demo

var map = new BigMap.Map("map");
map.centerAndZoom(new BigMap.Point(116.404, 39.915), 10);
var control = new BigMap.MapTypeControl();// 右上角,添加默认地图类型控件
//添加控件
function add_control(){
	map.addControl(control);        
}
//移除控件
function delete_control(){
	map.removeControl(control);     
}