openlayers 保存当前地图View为图片
/**
* 保存地图为图片工具栏
*/
function addMapToolSavePicture() { var saveElement = document.createElement('a');
saveElement.className = "mapbtn glyphicon glyphicon-picture";
saveElement.setAttribute("data-toggle", "tooltip");
saveElement.setAttribute("data-placement", "left");
saveElement.setAttribute("title", "SavePicture");
saveElement.onclick = function() { // 此方法只能保存背景地图及图层数据,但是不能保存control,使用 html2canvas 可以保存地图控件信息,比如图例信息等。
// olMap.once('postcompose',
// function(event) {
// var canvas = event.context.canvas;
// if (navigator.msSaveBlob) {
// navigator.msSaveBlob(canvas.msToBlob(), 'map.png');
// } else {
// // canvas.toBlob(function(blob) {
// // saveAs(blob, 'map.png');
// // });
// }
// });
// olMap.renderSync(); html2canvas(document.getElementById(mapId)).then(
function (canvas) {
canvas.toBlob(function (blob) { saveAs(blob,'map.png'); });
});
}; document.getElementById(soToolBarId).appendChild(saveElement);
}
openlayers 保存当前地图View为图片的更多相关文章
- OpenLayers 3 之 地图视图(View)
OpenLayers 3 之 地图视图(View) 初始化一幅地图,必备的三要素之一视图(view),这个对象主要是控制地图与人的交互,如进行缩放,调节分辨率.地图的旋转等控制.也就是说每个 map对 ...
- Android View转为图片保存为本地文件,异步监听回调操作结果;
把手机上的一个View或ViewGroup转为Bitmap,再把Bitmap保存为.png格式的图片: 由于View转Bitmap.和Bitmap转图片都是耗时操作,(生成一个1M的图片大约500ms ...
- HTML5 网络拓扑图整合 OpenLayers 实现 GIS 地图应用
在前面<百度地图.ECharts整合HT for Web网络拓扑图应用>我们有介绍百度地图和 HT for Web 的整合,我们今天来谈谈 OpenLayers 和 HT for Web ...
- HT for Web整合OpenLayers实现GIS地图应用
HT for Web作为逻辑拓扑图形组件自身没有GIS功能,但可以与各种GIS引擎即其客户端组件进行融合,各取所长实现逻辑拓扑和物理拓扑的无缝融合,本章将具体介绍HT for Web与开发免费的Ope ...
- OpenLayers 3 之 地图控件(control)
OpenLayers 3 之 地图控件(control) 地图控件(control)是指地图上比例尺,缩略图,拉近拉远的按钮,滚动控制条等控件,默认控件有三个,可以禁用. OpenLayers 3 之 ...
- 微信小程序--地图上添加图片
如何在微信小程序地图添加上,添加图片? 在微信小程序中,地图的层级最高,所以我们没有办法,通过定位,在地图上添加图片等信息; 处理办法: 添加控件:controls; 其中有个属性position,进 ...
- SpringMVC 上传图片保存到服务器 同时更改图片名称保存至数据库
@RequestMapping(value = "/save.do", method = RequestMethod.POST) public String saveDriv ...
- openlayers对接百度地图新方法
上次给大家提供的openlayers对接百度地图有些问题,是因为没有进行分辨率设置,也没有进行相应的平面坐标转换,获取getURL的方法还是没有变化的 getURL: function (bounds ...
- 生成二维码,并且保存,指定位置的view成图片,并且保存到本地相册
效果图: 保存的图片效果是: 保存到本地的,是整个视图,不只是单单的二维码的图片, 在了解的一番过程之后,我知道了, 1.首先要去获取保存图片的写入权限:(使用 https://github.com/ ...
随机推荐
- CSS中的vertical-align属性
1,vertical-align属性的作用? 设置元素垂直对齐的方式: 2,该属性使用过程的注意点: 与text-align属性不同,text-align属性是设置给需要对齐元素的父元素的, 而ver ...
- RT-Thread can - STM32F103ZET6
SDK版本v4.0.2 目前,RT-Thread Studio还不能够自定义添加can设备.下面介绍手动添加过程: 使用RT-Thread Studio创建一个简单工程 使用RT-Thread env ...
- 搭建Linux(Ubuntu)系统下的Differential Datalog运行环境
DDlog is a bottom-up, incremental, in-memory, typed Datalog engine. It is well suited for writing pr ...
- Leetcode字典树-720:词典中最长的单词
第一次做leetcode的题目,虽然做的是水题,但是菜鸟太菜,刚刚入门,这里记录一些基本的知识点.大佬看见请直接路过. https://leetcode-cn.com/problems/longest ...
- M5310-A 版本
模块外表 型号 BAND M5310-A MBRH0S04 +NB ...
- ansible基本使用(一)
ansible是什么? ansible是新出现的自动化运维工具,基于Python开发,集合了众多运维工具(puppet.chef.func.fabric)的优点,实现了批量系统配置.批量程序部署.批量 ...
- 论文阅读笔记(二十三)【ECCV2018】:Robust Anchor Embedding for Unsupervised Video Person Re-Identification in the Wild
Introduction 当前主要的非监督方法都采用相同的训练数据集,这些数据集在不同摄像头中是对称的,即不存在单个行人的错误项,这些方法将在实际场景中效果下降.在本方法中,作者引入了非对称数据,如下 ...
- CSS中before、after伪类选择器的巧用
大家好,今天给大家带来使用css中 before . after 实现两个效果,话不多说,我们先来看看, before 和 after 它们的作用是什么 选择器 作用 before 向选定的元素前插入 ...
- 编译U-Boot时command not found的解决方法
我使用的U-Boot版本是u-boot-2012.10,编译的步骤为 cd u-boot-2012.10 make s5p_goni_config sudo make 然后,就会看到错误提示 /bin ...
- swiper滑动失效问题
最近在写移动端的项目,页面有用的是swiper滑动的. 但是会发现在滑动时,不灵活,就是滑动时隐藏的数据会显示,但是不滑动数据又在初始那,隐藏的数据还是看不到. 于是各种排除问题,终于在pc端+移动端 ...