前端系列——vue2+高德地图web端开发（地图控件）

前言

本次文章仅围绕地图组件展开

地图控件说明

https://lbs.amap.com/api/jsapi-v2/documentation#control

控件使用

了解关键使用方法名

map.addControl()

没错就是这个addControl()用于在地图中添加组件
知道这个之后我们直接开始

1.在loader的plugins中进行引入

进入MapContainer.vue中找到我们的initMap函数的plugins，添加一个AMap.Scale比例尺控件

methods: {
   
    initMap() {
   
      AMapLoader.load({
   
        key: '2c1c4affeb410923990fec54c5af721a', // 申请好的Web端开发者Key，首次调用 load 时必填
        version: '2.0', // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
        plugins: ['AMap.Scale'] // 需要使用的的插件列表，如比例尺'AMap.Scale'等
      })
        .then(AMap => {
   
          this.map = new AMap.Map('container', {
   
            //设置地图容器id
            viewMode: '3D', //是否