众所周知,高德地图作为中国第一家拿到国际GPS卫星定位的厂商,权威性是毋庸置疑的。那么我们改怎么合理利用高德地图api来运用到我们的开发中去,下面我做了个测试,简单介绍一下高德地图api 的使用。
第一:搜索高德地图api点击进入官网。
点击右上角的注册按钮注册成为高德地图的开发者。选择个人开发。
第二:登录高德地图,选择【应用管理】点击【创建新应用】建立新的应用。
点击创建新应用,选择一个你要的应用类型,我选的是web端,设置好名称和类型,就可以使用了。
创建好新应用之后点击黑圈中的【添加新的key】 设置一个新的key名称。
第三:新建一个html文件,加入以下script文件。
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.4.7&key=您申请的key值"></script>
第四:新建一个div容器,让他的id为container ,设置地图的宽和高。
<div id="container"></div>
<style>
#container {
width:1200px;
height: 600px;
} </style>
第五:调用高德地图api中的方法新建一个地图对象
var map = new AMap.Map('container', {
zoom:11,//级别
center: [116.397428, 39.90923],//中心点坐标
viewMode:'3D'//使用3D视图
});
这是简单的一个调用3d视图地图的方法,地图中心点是确定好的。
示例图:
第六:可以为地图增加图层,增加实时路况一层。
var map = new AMap.Map('container', {
resizeEnable: true,
zoom:11,//级别
center: [116.397428, 39.90923],//中心点坐标
// viewMode:'3D'//使用3D视图
});
//实时路况图层
var trafficLayer = new AMap.TileLayer.Traffic({
zIndex: 10
});
map.add(trafficLayer);//添加图层到地图
示例图:
除此之外:地图 JS API 提供了标准、卫星、路网、路况、建筑等多个官方图层,同时也提供了加载第三方WMS、WMTS、XYZ等标准图层的接口,也提供了把一般的图片、Canvas、视频、热力等作为图层的能力。