Export/print map in Leaflet

Question

I'm working with leaflet and pure JS/jQuery to make a choropleth map and i've a problem when i try to export it to a local file as PNG/PDF/etc. I want to save the map directly in the main folder, pressing a control print button, editing the default output path if it is possible.

In leaflet documentation appear four plugins to make it:

• using Leaflet.print: i couldn't apply it, maybe for my little knowledge in js/leaflet/mapfish to use it. There is no page demo available to see how works. Then i opened the html example on github, index.html, to see how works, but it is used Mapfish to make the print, using a info.json file... I have a layergroup using two jsons to paint and colour polygons, as you can see in the JSFiddle link below.

• using Leaflet-image: i applied it and it generated a map, only with the base of mapbox, at right side of the original map using a topright button.

• using Leaflet-easyPrint: it works: generate the control button at topleft (OK, i like the button!) and print the map BUT in the print preview it doesn't show the legend colours.

• using leaflet.browser.Print: similar as easyPrint in demo, but i do not want the whole browser view. I only want the map, so i didn't try it.

Also, i tried a jQuery print plugin using map div id, but the export map had not the colour legend (and i want to save in a local file).

Therefore, is there a way to do it? If you can explain it to me step-by-step i would be very grateful.

This is a JSFiddle applying leaflet-easyPrint and leaflet-image.

Solution

I think your best option here is to go with easyPrint. It does have the issue you are mentioning, see: https://github.com/rowanwins/leaflet-easyPrint/issues but as far as i can tell they are supposed to be solved in the V2 branch: https://github.com/rowanwins/leaflet-easyPrint/tree/v2 Changes are undocumented so far, so to find out what's changed you need to go through the issues i posted before.