功能概要
一、覆盖物
最常用的地图覆盖物是Marker和信息窗体,除此之外,我们提供了圆Circle、多边形Polygon、折线Polyline、右键菜单ContextMenu等。
名称 | 类名 | 简介 |
点标记 | Marker | 用来在地图上添加点状标记,可指定任意icon或者content |
信息窗体 | InfoWindow | 用来展示比较详细或者复杂的内容,同一事件只能展示一个 |
圆 | Circle | 以某一中心和半径(m)在地图上绘制圆 |
多边形 | Polygon | 通过路径path在地图上绘制多边形,支持填充、描边以及多环多边形 |
折线 | Polyline | 通过路径在地图上绘制折线,支持描边以及虚线 |
右键菜单 | ContextMenu | 封装地图的右键菜单,鼠标右键单击时弹出 |
二、图层
除了默认的图层之外,API提供了路况Traffic、卫星Satellite、路网RoadNet、3D楼块Buildings等图层类,使用多图层的时候有两种方式, 第一种方式,在地图初始化的时候将需要的图层设定到layers属性中:
名称 | 类名 | 简介 |
默认图层 | TileLayer | 默认样式的图层,不使用layers属性的时候无需设置 |
实时交通 | TileLayer.Traffic | 用来展示实时路况,可设定刷新频率等 |
卫星 | TileLayer.Satellite | 用来展示卫星影像图层 |
路网 | TileLayer.RoadNet | 用来展示交通网络,通常与卫星图层叠加使用 |
3D楼快 | Buildings | 展示三维效果的建筑物楼快 |
var defaultLayer = new AMap.TileLayer();
var traffic = new AMap.TileLayer.Traffic();
var map = new AMap.Map('container',{
zoom: 10,
layers: [
defaultLayer,//默认图层
traffic//实时交通图层
],
center: [116.39,39.9]
});
三、控件
API提供了工具条、比例尺、定位、鹰眼、类别切换等常用的控件,一般使用的时候需要通过plugin方法将插件的功能引用之后,然后进行插件的初始化和添加:
AMap.plugin(['AMap.ToolBar','AMap.Scale','AMap.OverView'],
function(){
map.addControl(new AMap.ToolBar());
map.addControl(new AMap.Scale());
map.addControl(new AMap.OverView({isOpen:true}));
});
名称 | 类名 | 简介 |
工具条 | ToolBar | 集成了缩放、平移、定位等功能按钮在内的组合控件 |
比例尺 | Scale | 展示地图在当前层级和纬度下的比例尺 |
定位 | Geolocation | 用来获取和展示用户主机所在的经纬度位置 |
鹰眼 | OverView | 在地图右下角显示地图的缩略图 |
类别切换 | MapType | 实现默认图层与卫星图、实施交通图层之间切换的控件 |
四、服务插件
高德地图为开发者免费提供了各种服务接口,为了方便使用,JSAPI对这些服务接口进行了包装,比如POI搜索、路线规划等很有用的服务,同控件一样,服务插件也是需要进行异步引入的:
名称 | 类名 | 简介 |
搜索 | PlaceSearch | 用来搜索各种兴趣点,比如建筑、店铺、公司等等一切 |
地物点搜索图层 | PlaceSearchLayer | 以麻点图层的形式展示POI搜索的结果,并提供交互事件 |
驾车路线规划 | Driving | 返回驾车路线规划的结果,使用map、panel的时候可自动展示结果 |
公交路线规划 | Transfer | 返回公交路线规划的结果,使用map、panel的时候可自动展示结果 |
步行路线规划 | Walking | 返回步行路线规划的结果,使用map、panel的时候可自动展示结果 |
输入提示 | Autocomplete | 返回关键字联想搜索的简明POI列表,使用input的时候可自动生成列表 |
行政区域查询 | DistrictSearch | 提供从国家到商圈的各级行政与商圈信息的查询 |
地理编码与逆地理编码 | Geocoder | 提供经纬度与地址之间的相互转换 |
云图图层 | CloudDataLayer | 实现用户在云图管理台录入的信息的图层展示 |
云图查询服务 | CloudDataSearch | 返回云图信息的查询结果 |
天气预报查询 | Weather | 提供当天与未来4天的天气预报查询 |
公交线路查询 | LineSearch | 按公交线路的名称编号进行查询 |
公交站点查询 | StationSearch | 按公交站点的名称进行查询 |
五、功能插件
除了服务之外,为了简化和方便广大开发者的研发工作,我们集成了很多有用的功能插件,比如高级信息窗体、拖拽导航、热力图等,以高级信息窗体为例:
名称 | 类名 | 简介 |
高级信息窗体 | AdvancedInfoWindow | 在普通信息窗体的基础上封装了周边搜索和路线规划 |
拖拽导航 | DragRoute | 封装了驾车路线规划(Driving)与鼠标交互功能 |
热力图 | Heatmap | 提供了按照热度数据进行热力图图层展示的功能 |
鼠标工具 | MouseTool | 提供了在地图上进行测距离和面积、画覆盖物等功能的封装 |
测距 | RangingTool | 提供了在地图上进行距离测量的功能封装 |
圆编辑 | CircleEditor | 提供了使用鼠标对圆进行编辑的功能 |
Poly编辑 | PolyEditor | 提供了使用鼠标进行圆编辑的功能 |
点聚合 | MarkerCluster | 对海量marker点按照级别进行自动聚合 |
AMap.plugin('AMap.AdvancedInfoWindow',function() {
var infowindow = new AMap.AdvancedInfoWindow({
content: '<h3>高德地图</h1><div>高德是中国领先的数字地图内容、导航和位置服务解决方案提供商。</div>',
offset: new AMap.Pixel(0, -30),
//offset用来调整使锚点和position重合
asOrigin:false //不显示出发功能
})
var openLngLat = [116.480983, 39.989628];
infowindow.open(map,openLngLat);
})