Convert leaflet map snippet to image

Question

I need to export a page that contain leaflet map to pdf. I tried to convert the map container to image but thats not working perfectly. The code I used is here http://jsfiddle.net/Sq7hg/2/ ``` html2canvas([document.getElementById('mydiv')], { onrendered: function (canvas) { document.getElementById('canvas').appendChild(canvas); var data = canvas.toDataURL('image/png'); console.log(data) // AJAX call to send `data` to a PHP file that creates an image from the dataURI string and saves it to a directory on the server var image = new Image(); image.src = data; document.getElementById('image').appendChild(image); } ``` }); This code not working perfectly for leaflet map.How can I implement this ?

Accepted Answer

I think you'd better off using leaflet-image plugin, which does exactly that. There is a demo linked from the header. The main catch is forcing Leaflet to use canvas for rendering.

Convert leaflet map snippet to image

Solution

Problem