码迷,mamicode.com
首页 > 其他好文 > 详细

利用canvas 导出图片

时间:2015-05-24 23:04:18      阅读:194      评论:0      收藏:0      [点我收藏+]

标签:

 

使用canvas绘制图片,并将图片导出。

 

将不同域下图片绘制到canvas上时,不能使用toDataURL来获取imgdata,因为 canvas 使用了没有权限的跨域图片在使用canvas.toDataURL()等数据导出函数的时候会报错! img.crossOrigin = "Anonymous" ,它开启了本地的跨域允许。当然服务器存储那边也要开放相应的权限才行,如果是设置了防盗链的图片在服务端就没有相应的权限的话你本地端开启了权限也是没有用的。

技术分享

 

function downloadImg(){
       var a = document.createElement(‘a‘);
       a.href = canvas.toDataURL(‘image/png‘); //下载图片
       a.download = ‘未命名.png‘; console.log(a);
       a.click();
   } 
    function drawImg(ctx){
        var img2 = new Image();
        img2.setAttribute(‘crossOrigin‘,‘anonymous‘);
        img2.src = ‘img/1.png‘;
        img2.onload = function (){
            ctx.drawImage(this,0,0);
           
        }
    }

 

参考:http://segmentfault.com/q/1010000000768672/a-1020000002436172

利用canvas 导出图片

标签:

原文地址:http://www.cnblogs.com/lydialee/p/4526536.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!