map组件polyline的点击事件问题

Question

在uniiapp上使用map组件，通过polyline绘制路线，那有没有点击路线就可以触发polyline触发事件的方法

Answer 1

在使用polyline绘制路线时，可以通过添加 tap 事件监听器来实现点击路线触发相应事件的功能。

示例代码如下：

<template>
  <view class="map">
    <uni-map id="myMap" :show-location="true" @ready="onReady"></uni-map>
  </view>
</template>

<script>
export default {
  methods: {
    onReady() {
      const mapCtx = uni.createMapContext('myMap',this);
      const points = [
        {latitude: 39.929986, longitude: 116.395645},
        {latitude: 39.949301, longitude: 116.402183},
        {latitude: 39.963928, longitude: 116.364351},
        {latitude: 39.912438, longitude: 116.418003},
        {latitude: 39.95354, longitude: 116.460593}
      ];
      // 绘制路线
      mapCtx.addPolyline({
        points,
        color: "#FF0000DD",
        width: 4,
        dottedLine: true,
        arrowLine: true,
        borderWidth: 2,

        // 监听点击事件
        onTapPolyline(e) {
          console.log("polyline tap", e)
        }
      })
    }
}

在上述示例中，我们定义了一个名为 onTapPolyline 的方法，并将其传递给 addPolyline 方法作为参数。这样，在用户点击 polyline 时，就会触发 onTapPolyline 方法并输出日志信息。你也可以按照自己的需求对该方法进行修改，实现更为丰富的交互效果。