Would anyone know if it is possible to move the navigation controls from top-right to top-left? By default, it is top-right, but I would like to add a company's logo at that position and I've seen other Mapbox maps with controls on the left.
Should be possible w/o hacking the DOM:
map.addControl(new mapboxgl.Navigation({position: 'top-left'}));
See the docs.
Note: haven't tried this; as w/ attribution, might be necessary to set the default navigation control to false
when initializing the map.
-
This won't work - position is not a parameter for Navigation. Instead the answer by @max-kaplan is correct. – fooquency Apr 7 '19 at 18:47
I could not get it to work with @james-conkling 's example above. I did this instead:
var nav = new mapboxgl.NavigationControl();
map.addControl(nav, 'top-left');
-
-
1Is there any way to center the control? I've tried .mapboxgl-ctrl-top-right{ top: 0; right: 50%; } but it places the right end of the control on the middle of the screen, but I wnat the middle of the control to be in the middle of the screen – Alejandro Lozdziejski Jan 8 '18 at 0:39
-
The one from James Conkling didn't work on my map but this one from Max Kaplin did. Thanks Max. – Aubrey Love Apr 3 '20 at 17:34
For the most recent version correct answer is:
map.addControl(new mapboxgl.NavigationControl(), 'top-left');