vue3高德地图+搜索+点击获取经纬度

首先 安装依赖

npm i @amap/amap-jsapi-loader --save

html（设置一个容器）点击位置控制台可以打印到数据 如果想要回显到input 只需在input内绑定v-modal即可

script

style

效果：

如果想要更改地图的图层颜色 就把这个layers更改为以下：

layers: [
                    new AMap.TileLayer.RoadNet(),
                    new AMap.TileLayer.WMS({
                        url: 'https://ahocevar.com/geoserver/wms', // wms服务的url地址
                        blend: false, // 地图级别切换时，不同级别的图片是否进行混合
                        tileSize: 512, // 加载WMS图层服务时，图片的分片大小
                        params: {
                            'LAYERS': 'topp:states',
                            VERSION: '1.3.0'
                        } // OGC标准的WMS地图服务的GetMap接口的参数
                    })
                ],

效果