在Leaflet中导出/打印地图

5
我正在使用leaflet和纯JS/jQuery制作一个区域填充地图,当我尝试将其导出为PNG/PDF等本地文件时,遇到了问题。我想直接保存地图到主文件夹,通过按下“控制打印按钮”来编辑默认输出路径(如果可能的话)。
在leaflet文档中有四个插件可以实现此功能
  • 使用 Leaflet.print: 我无法应用它,可能是因为我在js/leaflet/mapfish方面的知识有限。没有页面演示可用以查看其工作原理。然后我打开了GitHub上的html示例,index.html,以查看其工作原理,但是它使用Mapfish制作打印,使用info.json文件...我有一个图层组,使用两个json来绘制和着色多边形,如下面的JSFiddle链接所示。

  • 使用 Leaflet-image: 我已经应用它并生成了一个地图,仅使用mapbox的基础地图,在原始地图的右侧使用一个topright按钮。

  • 使用 Leaflet-easyPrint: 它可以工作:在左上角生成控制按钮 (好的,我喜欢这个按钮!) 并打印地图,但在打印预览中不显示图例颜色。

  • 使用 leaflet.browser.Print: 在演示中与easyPrint类似,但我不想要整个浏览器视图。我只想要地图,所以我没有尝试过。

同时,我尝试过使用 jQuery打印插件来使用地图div id, 但导出的地图没有颜色说明(而且我想保存在本地文件中)。

因此,有没有办法可以实现呢?如果您可以为我逐步解释,我将非常感激。

这是一个 JSFiddle,应用了leaflet-easyPrintleaflet-image

1个回答

2

1
你说得对:插件V2完美地将图像(PNG)导出到本地文件,只需按地图左上角的打印按钮即可。现在我想做到避免浏览器功能;模拟点击(也许使用JavaScript)并直接保存到路径中(这是我的最初目标哈哈)。感谢您提供的信息! - Felipe Piña
你成功通过模拟点击来触发图像导出了吗?如果是的话,能否分享一下相关代码? - waskawy_wombat
警告!如果您希望此功能在所有浏览器上都能正常工作,请寻找其他解决方案,因为dom-to-image在IE上无法正常工作。 - David Ćeranić

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接