一.申请KEY
这里以高德地图为例,链接直达:https://lbs.amap.com/
1.打开控制台,登陆一下。
2.我的应用,创建新应用。
3.信息填写
4.得到key和安全密钥
二.JS填写
<div id="container"></div> //承载地图的容器<script type="text/javascript">window._AMapSecurityConfig = {securityJsCode: "「你申请的安全密钥」", //填写你的安全密钥};
</script>
<scripttype="text/javascript"src="https://webapi.amap.com/maps?v=2.0&key=你申请的key值" //改成你的KEY
></script>
<script type="text/javascript">//地图初始化应该在地图容器div已经添加到DOM树之后var map = new AMap.Map("container", {zoom: 12,});
</script>
效果展示:
之外在官网那里还有一些地图的小组件,链接:https://lbs.amap.com/api/javascript-api-v2/summary
有兴趣可以看看