qrcode生成二维码，canvas转化为图片

最新推荐文章于 2024-10-07 20:54:28 发布

不破小子

最新推荐文章于 2024-10-07 20:54:28 发布

阅读量2.4w

点赞数 3

分类专栏： web前端大杂烩

本文链接：https://blog.csdn.net/chenshuyang716/article/details/50997816

版权

web前端大杂烩专栏收录该内容

32 篇文章 0 订阅

订阅专栏

可以用jquery.qrcode.min.,js将一个页面生成二维码，该插件支持canvas和table，默认为canvas

核心代码：

$('#qrcodeCanvas').qrcode({
width:150,
height:150,
text:"http://www.o-home.com/select/print"
});

将canvas转化为图片，主要用到canvas的toDataURL方法，toDataURL(type, ratio)函数，参数type在image/png，image/jpeg,image/svg+xml等 MIME类型中选择（可以不填，默认是image/png）。如果是type = “image/jpeg”，可以有第二个参数，如果第二个参数ratio的值在0-1之间，则表示JPEG的质量等级，否则使用浏览器内置默认质量等级。

然而上面方法只能将图片转化为base64，还需要进一步生成图像文件，可以参考的网址：https://segmentfault.com/a/1190000003853394

核心代码：

function canvasToImage(canvas){
    debugger;
   /* var image = new Image();*/
    var type="image/png";
    var dataurl= canvas.get(0).toDataURL(type).replace("image/png", "image/octet-stream");//toDataURL是canvas的一个方法，没有用get(0)会报错canvas.tofDataURL is not a function
    window.location.href=dataurl;
}