JavaScript API简介
高德地图 JavaScript API，是由 JavaScript 语言编写的应用程序接口，它能够帮助您在网站或移动端中构建功能丰富、交互性强的地图应用程序。除了基本地图功能的接口外，JavaScript API还提供了诸如本地搜索、路线规划等数据服务，您可以根据自己的需要进行选择性使用。目前,最新版本为JavaScript API V1.3.18。
调用 JavaScript API 前用户需要先注册账户成为高德地图开发者，并申请key，API引用地址为“http://webapi.amap.com/maps?v=1.3&key=您申请的key”，下面先讲讲最基本的在网页中加载地图是如何实现的。初步体验高德地图。
第一、新建demo.html页面
第二、在<head></head>之间添加如下代码
<link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/> <script src="http://webapi.amap.com/maps?v=1.3&key=您申请的key"></script>
css样式必须加上，否则地图不显示。
key是我们在高德地图api管理中心成为开发者之后申请的key
第三、添加地图容器，在<body></body>之间添加如下代码
<div id="container"></div>
第四、初始化高德地图
<script>
var map = new AMap.Map('container', {
resizeEnable: true,
zoom:11,
center: [116.397428, 39.90923]
});
</script>zoom地图大小展示的级别。大小共有【3-18】级别
center 地图中心，如不设置地图初始化属性，地图会根据你所在城市作为地图中心点显示。初始化最后一项记得不要带有","否则初始化失败。
第五、效果图
第六、完整代码
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
<title>基本地图展示</title>
<link rel="stylesheet" href="http://cache.amap.com/lbs/static/main1119.css"/>
<script src="http://webapi.amap.com/maps?v=1.3&key=a78c809195bb2a6124a930a1e0f1eb02"></script>
</head>
<body>
<div id="container"></div>
<script>
//V型知识库 www.vxzsk.com
var map = new AMap.Map('container', {
resizeEnable: true,
zoom:11,
center: [116.397428, 39.90923]
});
</script>
</body>
</html>
此文章本站原创，地址 https://www.vxzsk.com/191.html
转载请注明出处！谢谢！
感觉本站内容不错，读后有收获？小额赞助,鼓励网站分享出更好的教程