js 如何将dom转换为 图片(base64)
1.引入js
<script src="https://cdn.bootcss.com/html2canvas/0.4.1/html2canvas.js"></script>
2.使用
function DownLoadDomImg(el) {
html2canvas(el, {
// 页面高度
height: el.height,
// 页面宽度
width: el.width,
onrendered: function(canvas) {
var mA = document.createElement("a");
mA.href = canvas.toDataURL()
mA.setAttribute('download', 'download.png');
mA.click();
console.log(mA);
// 如果是ie浏览器 则需要 使用ie浏览器的下载方法 进行下载 一会补充
}
});
}
// 使用
DownLoadDomImg(document.getElementById("box"))
这个时候 传入想要下载的 元素id 调用此方法的时候就可以实现下载
js 如何将dom转换为 图片(base64)的更多相关文章
- JS实现图片base64转blob对象,压缩图片,预览图片,图片旋转到正确角度
base64转blob对象 /** 将base64转换为文件对象 * @param {String} base64 base64字符串 * */ var convertBase64ToBlob = f ...
- js 图片base64转file文件的两种方式
js 图片base64转file文件的两种方式 https://blog.csdn.net/yin13037173186/article/details/83302628 //将base64转换为bl ...
- php将base64字符串转换为图片
昨天用一个js插件 [链接]: http://www.erdangjiade.com/js/910.html 实行了图片裁剪并预览,不过它生产的图片资源是一个base64字符串,不好保存后来在网上找到 ...
- js压缩图片base64长度
var myCanvas=$('.img-container > img').cropper('getCroppedCanvas'); (function (base64){ var image ...
- PHP将图片转base64编码以及base64图片转换为图片并保存代码
图片转base64编码 /*图片转换为 base64格式编码*/ $img = 'uploads/01.png'; $base64_img = base64EncodeImage($img); ech ...
- PHP的图片转base64,base64图片转换为图片并保存代码
打卡记录 1. 图片转base64代码 /*图片转换为 base64格式编码*/ $img = 'images/avatar.jpg'; $base64_img = base64EncodeImage ...
- 从Base64编码转换为图片文件
package luckyclient.utils;import java.io.FileInputStream;import java.io.FileOutputStream;import java ...
- Jquery 网页转换为图片
/* html2canvas 0.5.0-alpha1 <http://html2canvas.hertzen.com> Copyright (c) 2015 Niklas von Her ...
- .NET将图片Base64字符串还原为图片(jpg格式)并保存到本地
1. 了解Base64字符串的形式是:data:image/jpeg;base64,字符串 2 .Base64字符串转换为图片的代码实现: string[] str = base64Str.Split ...
随机推荐
- 图像风格迁移(Pytorch)
图像风格迁移 最后要生成的图片是怎样的是难以想象的,所以朴素的监督学习方法可能不会生效, Content Loss 根据输入图片和输出图片的像素差别可以比较损失 \(l_{content} = \fr ...
- (十三)事件分发器——event()函数,事件过滤
事件分发器——event()函数 事件过滤 事件进入窗口之前被拦截 eventFilter #include "mywidget.h" #include "ui_mywi ...
- Golang语言的入门开始
一.golang介绍与安装 二.golang-hello world 三.golang的变量 四.golang的类型 五.golang的常量 六.golang的函数(func) 七.golang的包 ...
- 关于 iOS 性能优化方面的面试题,
这是我前面几天碰到的面试题: 如何对定位和分析项目中影响性能的地方?以及如何进行性能优化? 我的答案: 定位方法: instruments 在iOS上进行性能分析的时候,首先考虑借助instrum ...
- textCNN原理
一.TextCnn的结构 1. 嵌入层(embedding layer) textcnn使用预先训练好的词向量作embedding layer.对于数据集里的所有词,因为每个词都可以表征成一个向量,因 ...
- trackerClient.getConnection()为null
如题,整了个fastDFS文件服务器.但是集成项目spring boot时上传文件失败! Debug到trackerClient.getConnection()时为null.于是看了服务器上track ...
- c++析构函数调用时机
- numpy&pandas补充常用示例
Numpy [数组切片] In [115]: a = np.arange(12).reshape((3,4)) In [116]: a Out[116]: array([[ 0, 1, 2, 3], ...
- 执行python文件
方法一: 通过控制台程序,一行一行执行python程序,输一行执行一行 方法二: 将程序用编辑器编辑好,再在控制台中用路径打开一次性执行(前提是py程序的默认打开方式是python解释器)
- :focus-within伪类选择器的3种应用
1.点击form里任意input隐藏form以外内容提高用户体验 <form><input type="text"></form> form { ...