javascript - Exportprint map in Leaflet - Stack Overflow

admin管理员组

文章数量:1334931

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.

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.

• javascript
• jquery
• leaflet

Share Improve this question Follow asked Jun 22, 2017 at 3:05 Felipe PiñaFelipe Piña 9911 gold badge22 silver badges1212 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 2

I think your best option here is to go with easyPrint. It does have the issue you are mentioning, see: https://github./rowanwins/leaflet-easyPrint/issues but as far as i can tell they are supposed to be solved in the V2 branch: https://github./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.

本文标签： javascriptExportprint map in LeafletStack Overflow