html实现可拖拽地图+定位到目前位置高德

最新推荐文章于 2023-07-21 14:21:32 发布

咩咩籽

最新推荐文章于 2023-07-21 14:21:32 发布

阅读量3.1k

点赞数

分类专栏：前端页面文章标签：地图定位拖拽

本文链接：https://blog.csdn.net/weixin_42521145/article/details/90051739

版权

本文介绍了如何使用HTML结合高德地图API实现地图的拖拽功能，并且详细讲解了如何添加定位功能，让地图可以显示用户当前的位置。

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

直接上代码

在这里插入图片描述

拖拽选址

<script type="text/javascript">
    AMapUI.loadUI(['misc/PositionPicker'], function(PositionPicker) {
        var map = new AMap.Map('container', {
            zoom: 16,
            scrollWheel: false
        });
        map.plugin(['AMap.Geolocation','AMap.ToolBar'], function () {

            var toolbar = new AMap.ToolBar();
            map.addControl(toolbar);
            var geolocation = new AMap.Geolocation({
                enableHighAccuracy: true, // 是否使用高精度定位，默认:true
                timeout: 5000,           // 超过5秒后停止定位，默认：无穷大
                maximumAge: 0,            // 定位结果缓存0毫秒，默认：0
                convert: true,            // 自动偏移坐标，偏移后的坐标为高德坐标，默认：true
                showButton: true,         //