h5接入高德地图

最新推荐文章于 2024-08-14 21:23:33 发布

LiAlisa

最新推荐文章于 2024-08-14 21:23:33 发布

阅读量4.3k

点赞数

本文链接：https://blog.csdn.net/qq_39516866/article/details/84931886

版权

这篇博客介绍了如何在H5中接入高德地图并实现定位功能。通过加载地图JSAPI脚本，创建地图实例，添加定位插件，获取用户当前位置，并进行逆地理编码获取详细地址。同时，博客提供了定位成功和失败的处理方法。

摘要由CSDN通过智能技术生成

<!-- 加载地图JSAPI脚本 -->
<script src="https://webapi.amap.com/maps?v=1.4.11&key=申请的高德地图的key"></script>
<script src="https://a.amap.com/jsapi_demos/static/demo-center/js/demoutils.js"></script>

<div id="container"></div>
<div class="info">
    <h4 id='status'></h4><hr>
    <p id='result'></p><hr>
    <p id='result1'>地址信息：</p><hr>
</div>

<script type="text/javascript">
     var lnglatXY='';
    var map = new AMap.Map('container', {
        resizeEnable: true
    });
    map.plugin('AMap.Geolocation', function() {
        var geolocation = new AMap.Geolocation({
            enableHighAccuracy: true,//是否使用高精度定位，默认:true
            timeout: 40000,          //超过10秒后停止定位，默认：5s
            buttonPos