vue-mapbox icon indicating copy to clipboard operation
vue-mapbox copied to clipboard

Click event on layer not firing off?

Open shmarts opened this issue 5 years ago • 3 comments

When I bind an event listener to MglGeojsonLayer it doesn't seem to emit the event

<template>
  <div class="mt-32">
    <MglMap :accessToken="accessToken" :mapStyle="mapStyle" class="map">
      <MglGeojsonLayer
        sourceId="airports"
        layerId="airports"
        :source.sync="geojson"
        :layer.sync="clusters"
        @click="handleClick"
      />
      <MglGeojsonLayer sourceId="airports" layerId="clusterCount" :layer="clusterCount" />
      <MglGeojsonLayer sourceId="airports" layerId="uncusteredPoint" :layer.sync="airport" />
    </MglMap>
  </div>
</template>

This is my template, am I doing something wrong? handleClick isn't seeming to get triggered

shmarts avatar Dec 08 '19 10:12 shmarts

Same problem here, did you solve it?

doylemark avatar Feb 19 '20 00:02 doylemark

This may be a dumb question, but are you clicking on a rendered feature of that layer (not just on the map generally)? @click and @mouseenter/leave are working in my project using the most recent release.

rognstad avatar Apr 02 '20 15:04 rognstad

Yes I was, I gave up with this library two months ago and wrote my own..

doylemark avatar Apr 03 '20 00:04 doylemark

I'm having the same problem with clusters. The @click event fires for the layer that has the cluster circle, but not for the unclustered layer. Something seems broken.

Maybe it's an issue with layers that reference an existing source?

richdunajewski avatar Jun 11 '20 03:06 richdunajewski

Same problem, I tried all events but none were fired.

In the clusters layer is working but not in a geojsonlayer.

Here is some of my code:

<MglMap ref="map" :accessToken="accessToken" :mapStyle.sync="mapStyle" :center="center" :zoom="zoom" @load="onMapLoaded">

<MglGeojsonLayer v-for="myLayer in geoJsonLayer" sourceId="places" :source="geoJsonSource" ref=myLayer.layerID layerId=myLayer.layerID :layer="myLayer" :key="'places' + myLayer.mapKey" @click="handleLayerClick" @mouseenter="handleLayerClick" />

handleLayerClick(event) { console.log(event); },

Anyone with a solution? Thanks!

osvcha avatar Oct 23 '20 19:10 osvcha