Search code examples
mapboxmapbox-gl-jsmapbox-glmapbox-marker

How to add a custom marker to 3D building map in mapbox?


I am trying to add a Mapbox map to my flask app. I have experience in python but I am new to JS and HTML. I am trying to add a 3D building app to visualize the results and I have got the layout of 3D maps from the Mapbox documentation page. However, I would like to add a marker at a particular location using latitude and longitude but I am not able to do so. Please let me know how can I add a location marker to the Mapbox 3D map.

The code for the 3d map is: https://docs.mapbox.com/mapbox-gl-js/example/3d-buildings/


Solution

  • This example shows how to add a Marker to a map https://docs.mapbox.com/mapbox-gl-js/example/set-popup/, however it will be on the ground plane, not at any given elevation in 3D.

    // create the marker
    new mapboxgl.Marker()
       .setLngLat([lng, lat])
       .addTo(map);