没有测距工具吗

[xiawnag]

没有测距工具吗

VueAMap 版本

OS/Browsers version

Vue 版本

复现地址

预期

实际

feature request

[Leega0]

自己拿到map实例，可以直接使用高德的测距api

[Wpcc]

如果你是根据npm安装vue-amap，那么需要以下步骤才能使用测距工具：

• 在 script 文件中引用 lazyAmapApiLoaderInstance

  import { lazyAMapApiLoaderInstance } from 'vue-amap'

• 在 data 中重新定义 this ，并使用 init 调用 lazyAmapApiLoaderInstance

  data(){
    var me = this
    return {
        events:{
            init:(o) => {
                lazyAMapApiLoaderInstance.load().then(() => {
                    AMap.plugin([
                        'Amap.RangingTool' // 引入测距插件
                    ]),
                    function(){
                        // 创建测距实例
                        const ruler = new Amap.RangingTool(o)
                        // 赋值给vue组件
                        me.mapRuler = ruler
                    }
                })
            }
        }
    }
  },
  methods:{
    turnRuler(){   // 定义方法，是否开启测距工具
        this.mapRuler.turnOn() // 开启:turnOn() 关闭：turnOff()
    }
  }

  • template 中定义DOM节点绑定事件

  <template>
  <el-button @click="turnRuler">开启测距工具</el-button>
  </template>

• 高德地图测距工具API