1. 程式人生 > >高德地圖Web端JavaScript API開發(一)---地圖基礎控制元件

高德地圖Web端JavaScript API開發(一)---地圖基礎控制元件

在地圖上新增一些基礎的地圖控制元件。

JavaScript API提供了工具條、比例尺、定位、鷹眼、基本圖層切換等常用的控制元件,使用的時候需要通過plugin方法將外掛的功能引入,然後進行控制元件的初始化和新增

var map = new AMap.Map('container',{
    zoom: 10,
    center: [116.39,39.9]
});

//新增地圖外掛  工具條、比例尺、鷹眼、地圖型別、定位
AMap.plugin(['AMap.ToolBar','AMap.Scale','AMap.OverView','AMap.MapType','AMap.Geolocation'],function(){
	//建立並新增工具控制元件,上下左右移動,以及縮放
	map.addControl(new AMap.ToolBar());
	map.addControl(new AMap.Scale());
	map.addControl(new AMap.OverView({isOpen:true}))
	map.addControl(new AMap.MapType());
	map.addControl(new AMap.Geolocation());
});

名稱

類名

簡介

工具條

ToolBar

集成了縮放、平移、定位等功能按鈕在內的組合控制元件

比例尺

Scale

展示地圖在當前層級和緯度下的比例尺

定位

Geolocation

用來獲取和展示使用者主機所在的經緯度位置

鷹眼

OverView

在地圖右下角顯示地圖的縮圖

類別切換

MapType

實現預設圖層與衛星圖、實施交通圖層之間切換的控