vuecli3.0中引入高德地图以及使用到的一些常用方法(正向地理编码,逆向地理编码, 画canvas,点击,鼠标事件,海量点)

借鉴:https://blog.csdn.net/rty426/article/details/90718375

1、高德地图的引入,高德API官网,我是用的webJs

2、高德地图实例中心:https://lbs.amap.com/demo-center/js-api

在vue中的具体操作,

1)在pubilc下的index.html中引入



vuecli3.0中引入高德地图以及使用到的一些常用方法(正向地理编码,逆向地理编码, 画canvas,点击,鼠标事件,海量点)_第1张图片

2、在vue.config.js中进行配置

module.exports = {
    lintOnSave: false,//关闭lint服务
    configureWebpack: {
        externals: {
            'AMap': 'AMap'
        }
    }
}

 3、封装的map组件





4、引用map组件 




 

你可能感兴趣的:(vuecli3.0中引入高德地图以及使用到的一些常用方法(正向地理编码,逆向地理编码, 画canvas,点击,鼠标事件,海量点))