0

As title. Because of the requests of my GIS project, I need to make the buttons of mapbox.com draw tools shown in a DIV, to make the DIV look like one of my created toolboxes. I've searched on Google using "mapbox.com draw tool in another div " or "mapbox.com draw tool show in a div" , but the results aren't suitable for my needs. If it is possible, may someone guide me to reach it?

I've thought to copy the outerHTML of the buttons in the generated draw tool and append to the target DIV....

$(".mapbox-gl-draw_ctrl-draw-btn").each(function(){
    $("#myTargetDIV")[0].innerHTML+=$(this)[0].outerHTML;
});

The buttons are shown in the target DIV but nothing happens when I pressed them.

riastrad
  • 1,624
  • 10
  • 22
Gary Lu
  • 53
  • 1
  • 2
  • 11
  • There is a similar example of placing a geocoder outside of the map div here https://docs.mapbox.com/mapbox-gl-js/example/mapbox-gl-geocoder-outside-the-map/. Have you tried this approach using `Node.appendChild()`? – geografa May 29 '19 at 21:34
  • @geografa You helped me a lot! I did it! Thank you very much! – Gary Lu May 30 '19 at 01:20

0 Answers0