Display a non-interactive map interactive=false

[shay-te]

Hello all, can you please help me.

The javascript support interactive=false. how can I achieve this with react-native version?

https://docs.mapbox.com/mapbox-gl-js/example/interactive-false/

Thank you,
Shay

[ferdicus]

Unfortunately there isn't a one stop solution for this atm (PRs welcome), so atm you would have to initialize a MapView and set these to false.

zoomEnabled | bool | none | false | Enable/Disable zoom on the map
scrollEnabled | bool | true | false | Enable/Disable scroll on the map
pitchEnabled | bool | true | false | Enable/Disable pitch on map
rotateEnabled | bool | true | false | Enable/Disable rotation on map

That should do the trick

[shay-te]

Thank you for the help!

[Florian-crg]

I've settled all theses to false
zoomEnabled: false,
scrollEnabled: false,
pitchEnabled: false,
rotateEnabled: false,
dragPan: false,
dragRotate: false,
doubleClickZoom: false
I first cant drag but I just have to scroll on the map and all become true I guess, since I can drag to move after the scroll have been made.
The javascript support interactive=false would be very nice.

[a-tokyo]

Unfortunately there isn't a one stop solution for this atm (PRs welcome), so atm you would have to initialize a MapView and set these to false.

zoomEnabled | bool | none | false | Enable/Disable zoom on the map
scrollEnabled | bool | true | false | Enable/Disable scroll on the map
pitchEnabled | bool | true | false | Enable/Disable pitch on map
rotateEnabled | bool | true | false | Enable/Disable rotation on map

That should do the trick

As of today (using v6) one needs to disable scrollZoom as well.

scrollZoom: false,

So the final solution becomes:

zoomEnabled: false,
scrollEnabled: false,
scrollZoom: false,
pitchEnabled: false,
rotateEnabled: false,
dragPan: false,
dragRotate: false,
doubleClickZoom: false

[shay-te]

Thank you for the comment it solves it 👍

[ferdicus]

feel free to ask questions like these within out gitter channel, it's full of helpful people :)

[shay-te]

will do it next time. thank you

…

On Mon, Jan 11, 2021 at 7:08 PM Kid Commit ***@***.***> wrote: feel free to ask questions like these within out gitter channel <https://gitter.im/react-native-mapbox-gl/Lobby>, it's full of helpful people :) — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <https://github.com/react-native-mapbox-gl/maps/discussions/1162#discussioncomment-274872>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/ABHNOAKILJS4TAEYLWVWRP3SZMWCLANCNFSM4V5ZYTBQ> .

[Gnative]

Just as a side note, if you want a non interactive map it might be worth looking at Mapbox static maps api. You can do quite a lot with that API and it's less of a hit on your usage limits

Mapbox Static API
Mapbox Static Map playground