js如何将openlayer地图导出为图片

Posted 2023-05-06

参考技术A 1.打开Biemap地图下载器，框选要发布的地图范围，双击弹出下载选项框，瓦片类型选择谷歌，文件类型建议使用png 格式，以获得最佳清晰度。
如何使用Openlayer发布地图

配置Openlayer:

地图瓦片下载完成之后 ，将瓦片放置在网站目录下的tile文件夹中。

新建一个index.html文件，放在网站目录下。

引入下载的Openlayer文件，这两个文件都需要引入
如何使用Openlayer发布地图

最后文件结构如下图：
如何使用Openlayer发布地图

index.html的HTML部分如下图：
如何使用Openlayer发布地图

JS部分如下图：
如何使用Openlayer发布地图

这样就配置好了，在浏览器中输入网站地址，可以正常浏览了，如下图：
如何使用Openlayer发布地图

如何使用Openlayer发布谷歌卫星地图

方法/步骤

下载地图瓦片
1.打开Biemap地图下载器，框选要发布的地图范围，双击弹出下载选项框，瓦片类型选择谷歌，文件类型建议使用png 格式，以获得最佳清晰度。

配置Openlayer:
地图瓦片下载完成之后 ，将瓦片放置在网站目录下的tile文件夹中。
新建一个index.html文件，放在网站目录下。
引入下载的Openlayer文件，这两个文件都需要引入

最后文件结构

index.html的HTML部分

JS部分

6
这样就配置好了，在浏览器中输入网站地址，可以正常浏览了，如下图： 参考技术A 1、打开水经注万能地图下载器，把鼠标放在左上角的图标上，在弹出的列表中选择“谷歌地图”，这样将地图切换到谷歌卫星地图。

2、把地图缩放到全球可见，点击“下载”→“框选下载”将全球框选上。

双击，在弹出的对话框中选择“高级模式”，设置好任务名称和勾选上下载级别，点击“确认”开始下载。

3、点击“列表”→“高级任务”可以看到下载任务，把鼠标放在下载任务上可以看到“导出拼接图片”的按钮，点击。

4、在弹出的“导出图片数据”对话框中“导出类型”一栏选择“瓦片：Google Map”，“保存类型”选择为“png”，点击“输出”完成谷歌瓦片的导出。

5、将附件内的谷歌离线API压缩包下载后解压到某个文件夹内，这里我解压到了D盘下的GoogleOfflineMap文件夹内，同时将生成的谷歌地图瓦片所在的文件夹修改7、6、“data”后也放到这个文件夹内。

7、打开文件夹GoogleMapAPIV3，用浏览器打开Example_GoogleMapAPI.html文件就可以看到发布的离线地图了。

8、如果需要做进一步的开发可以对Example_GoogleMapAPI.html文件进行相关的修改。本回答被提问者采纳