Open vinaykumarhegde opened 6 years ago
UPDATE I was able to get this done using the example for placing geocoder elements outside the map container.
<div id='map' style='width:100%; height: 300px;'></div>
<div id='directions' style='width:100%; height: 300px;'></div>
<script>
mapboxgl.accessToken = 'AccessToken';
var map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/mapbox/streets-v9',
center: [-79.4512, 43.6568],
zoom: 13
});
var directions = new MapboxDirections({
accessToken: mapboxgl.accessToken
});
map.addControl(directions, 'top-right');
document.getElementById('directions').appendChild(directions.onAdd(map));
</script>
I too, would like to be able to do something like this.
Looking at the API Docs, I found https://www.mapbox.com/mapbox-gl-js/api/#icontrol
Which leads me to believe I could create my own control and specify the container. It would be cool if the MapboxDirections object accepted a 'container' parameter.
Is it possible to show driving instructions to a separate DOM element outside the MAP? I know geocoder supports this link.