之前做过与高德地图有关的项目开发，高德地图的API使用起来很方便。高德地图
JavaScript API，是由 JavaScript 语言编写的应用程序接口，它能够帮助您在网站或移动端中构建功能丰富、交互性强的地图应用程序。除了基本地图功能的接口外，JavaScript API还提供了诸如地点搜索、路线规划、定位、地址解析、行政区查询等数据服务，您可以根据自己的需要进行选择性使用。目前,最新版本为JavaScript
API V1.4.0。
好东西要大家分享，现将高德的开发过程整理一下，与各位互相交流学习
。
首先总结一下地图引用的基本流程，完成这些流程即可完成地图的引入。话不多说，Let's Go!
- 在官网申请JSAPI的开发者Key； --->登录高德账号，完成key申请
- 引入高德JavaScript API入口脚本
<script type="text/javascript" src="http://webapi.amap.com/maps?v=1.4.0&key=您申请的key值"></script>
- 创建地图容器 ，在页面的body中添加一个div容器
<div id="container"></div>
- 可以使用CSS样式控制地图容器的大小，可以不设置
#container {width:300px; height: 180px; }
- 创建地图
var map = new AMap.Map('container');
这个时候API将根据用户所在的城市自动进行地图中心点和级别的设定当然，一般的都是给地图设置中心点和坐标属性（我比较喜欢这样，省事）var map = new AMap.Map('container',{
zoom: 10, //设置地图缩放等级
center: [116.39,39.9] //中心点经纬度，要求经度在前，纬度在后，且使用的是高德坐标
});
- 在使用过程中我发现还有一个必不可少的因素，那就是引入高德CSS，没有这个link，地图显示不出来
<link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/>
到这里，一个地图就已经可以显示出来了！第一步创建地图就已经完成了！
版权声明：本文来源CSDN，感谢博主原创文章，遵循 CC 4.0 by-sa 版权协议，转载请附上原文出处链接和本声明。
原文链接：https://blog.csdn.net/Tiger_shl/article/details/78029471
站方申明：本站部分内容来自社区用户分享，若涉及侵权，请联系站方删除。
-
发表于 2020-03-01 21:25:17
- 阅读 ( 1303 )
- 分类：
