javaScript 截屏保存base64编码图片

最新推荐文章于 2025-02-23 15:18:23 发布

cloudyzhao

最新推荐文章于 2025-02-23 15:18:23 发布

阅读量8.8k

点赞数

分类专栏： js 文章标签： js 截图 canvas

本文链接：https://blog.youkuaiyun.com/zy841958835/article/details/79008880

版权

js 专栏收录该内容

3 篇文章

订阅专栏

js截屏需要html2canvasv.js

http://download.youkuaiyun.com/download/zy841958835/10185219

把对应的dom元素转换成图片

shotScreen = function (){
    var str = $('#screenshot');
    html2canvas([str.get(0)], {
        onrendered: function (canvas) {
            $('#echartsWhole').attr( 'href' , canvas.toDataURL());
            $('#echartsWhole').attr( 'download' , 'myjobdeer.png');
            $('#echartsWhole').css('display','inline-block');
        }
    });
};

调用html2canvas方法传入一个dom元素canvas.toDataURL()获得当前dom元素转化成的base64编码然后使用html的a标签的download属性把当前图片下载到本地。
a标签的这个功能也可直接下载base64的图片，比如从服务端传过来的图片是base64编码的直接填入a标签的href属性然后downlaod属性填入保存图片的名字即可。