Plotly does not generate feature ids for mapbox

[zouhairm]

From the looks of it, Plotly is not setting ids for the features that it generates to display markers using mapbox, and so the features being generated are not addressable with mapbox API functions like setfeaturestate.

From https://docs.mapbox.com/mapbox-gl-js/api/#map#setfeaturestate

This method requires the feature.id attribute on data sets. For GeoJSON sources without feature ids, set the generateIds option in the GeoJSONSourceSpecification to auto-assign them. This option assigns ids based on a feature's index in the source data.

Here is a codepen to show that:
https://codepen.io/anon/pen/pBbzbM

Any chance this can be done in a future release? In the meantime, anyone has ideas on how to properly address features created by plotly using the MapBox API.

For context: my use case is such that I am trying to set some hover effects on mouseover (changing cursor, changing opacity of markers, etc.). for "native" plotly graphs I can do that with plotly callbacks, but for mapbox I need to use their API. I've managed to style the cursor, and while I can change an entire layer's opacity using https://docs.mapbox.com/mapbox-gl-js/api/#map#setpaintproperty , in order to do it symbol by symbol I think I need to use https://docs.mapbox.com/mapbox-gl-js/api/#map#setfeaturestate

[etpinard]

You're the first person we hear about using plotly.js' scattermapbox trace together with the mapbox-gl API. Unfortunately for your use case, we never intended to make plotly.js work side-by-side with mapbox-gl. Our goal was simply to make a high-level JSON-serializable wrapper around it.

That said, if you'd like to make a PR patching a few things in our mapbox-wrapper code base to make your life easier, we'll gladly take a look at it.

If you have other questions about making plotly.js work side-by-side with mapbox-gl, please use https://community.plot.ly/c/plotly-js from now on. That way, if there are other users can benefit from it.

Thanks for writing in.

[zouhairm]

@etpinard Thanks for the context. I'm happy to attempt a PR to address this. I think it should be as easy as adding generateId: true to the plotly-mapbox.js.

I tried doing that but it looks like Plotly.js is using an old version of the mapbox API with the generateId keyword not being supported. It might still be possible to do by manually setting the ids for each of the data points defined in the geojson geometry/features. I'm not set-up to build plotly.js and debug it. I'll see if I find time to do that.

For context, the reason I am not bypassing Plotly and just using the mapbox API to create the plots is that I'm using Dash in the backend. Plotly/Dash provide enough functionality to get started, but now that I am trying to do more advanced things (transitioning/flying between locations, hover effects, etc.) I'm finding the need to dig into the mapbox API - which overall has been ok except for a few instances like this one.

[etpinard]

I tried doing that but it looks like Plotly.js is using an old version of the mapbox API with the generateId

That's correct. Keeping up with the mapbox-gl 0.x breaking changes can be time-consuming, so we only bump our mapbox-gl dep version when we need it.

We're planning on implementing #3592 in the next few months, so we'll probably bump mapbox-gl while working on that.

[etpinard]

Heads-up @zoohair if you're still looking to make a PR, we're now using [email protected] on master (and our upcoming 1.49.0 release).

[zouhairm]

@etpinard : thanks for following up but I ended up doing something different. I am not sure I have the cycles right now to dust this back up - especially that the project I was using is still on Dash 0.4.2 and upgrading it to Dash 1.0.0 and latest plotly breaks a couple of things. Maybe when I get back to working on it again and upgrade I'll see if I can do a PR.

[gvwilson]

Hi - we are currently trying to tidy up Plotly's public repositories to help us focus our efforts on things that will help users most. Since this issue has been sitting for several years, I'm going to close it. If it's still a concern, we'd be grateful if you could open a new issue (with a short reproducible example if appropriate) so that we can add it to our backlog. Thanks for your help - @gvwilson