【canvas】导出图片背景色

一般是透明底或者黑色，想要白色背景的图片。

var imageData = ctx.getImageData( 0,0,w,h);
for (var i = 0; i < imageData.data.length; i += 4) {// 当该像素是透明的，则设置成白色if (imageData.data[i + 3] == 0) {imageData.data[i] = 255;imageData.data[i + 1] = 255;imageData.data[i + 2] = 255;imageData.data[i + 3] = 255;}
}
ctx.putImageData(imageData, 0, 0);

完整代码

rotate90(imgUrl, imgW, imgH, deg) {let that = this;var Img = new Image(),dataURL = "",deg = deg;Img.src = imgUrl;Img.onload = function() {var canvas = document.createElement("canvas"), //创建canvas元素ctx = canvas.getContext("2d"),//确保canvas的尺寸和图片一样width = imgW,height = imgH,w = deg % 180 == 0 ? width : height,h = deg % 180 == 0 ? height : width,obj = {x: w / 2,y: h / 2,w: width,h: height};canvas.width = w;canvas.height = h;var imageData = ctx.getImageData( 0,0,w,h);for (var i = 0; i < imageData.data.length; i += 4) {// 当该像素是透明的，则设置成白色if (imageData.data[i + 3] == 0) {imageData.data[i] = 255;imageData.data[i + 1] = 255;imageData.data[i + 2] = 255;imageData.data[i + 3] = 255;}}ctx.putImageData(imageData, 0, 0);ctx.translate(obj.x, obj.y);ctx.rotate((deg * Math.PI) / 180);ctx.translate(-obj.x, -obj.y);ctx.drawImage(Img,obj.x - obj.w / 2,obj.y - obj.h / 2,obj.w,obj.h); //将图片绘制到canvas中dataURL = canvas.toDataURL(); //转换图片为dataURL（转换成base64）console.log(dataURL);that.$emit("getSign", dataURL);that.switchPlay(); // 确定 返回表单页};}

【canvas】导出图片背景色相关推荐

android canvas png 失真,【小程序】--------------处理canvas导出图片模糊问题-------------【劉】...
一.业务需求: 使用canvas在前端生成海报,并在海报上添加上水印.最后导出图片并保存到本地. 二.业务逻辑实现: (1)创建canvas画布======>(2)在canvas上绘制海报=== ...
解决canvas导出图片模糊问题
// 解决导出图片模糊的方法toBeCanvas() {var copyDom = $("#canvasQR");var width = copyDom.offsetWidth; ...
canvas导出图片python_报表工具+VBA实现SuccessFactors前台批量导出员工照片
在SuccessFactors的员工档案(People Profile)中,员工可以自助上传自己新拍的证件照. 帮助新员工混个脸熟,帮老员工展现最新的精神面貌.(时间一长,基本一眼就看出来是在天真蓝拍 ...
html去除图片背景颜色,canvas实现图片背景色去色变透明 » 张鑫旭-鑫空间-鑫生活...
CSS代码: h4 + canvas { cursor: crosshair; } canvas { background: url(./tt-bg.gif); } HTML代码: 左取色图,右效果图 ...
canvas导出图片python_python的reportlab库介绍、制作pdf和作图
1 说明 1.1 reportlab模块是用python语言生成pdf文件的模块,也可以作图. 1.2 已经亲测,拿来就可以使用,适合收藏,万一自己需要就可以直接使用. 1.3 环境:python3. ...
canvas导出图片python_利用Python将PPT转换为图片并合成长图
最近因为某些需求需要将PPT转换为图片并合并成预览图,于是第一时间就想到了用python解决问题,过程中参考了一位老哥写的文章,链接如下. Python行家:用Python实现ppt转化图片(附带长图 ...
canvas导出图片python_用Python实现ppt转化图片(附带长图合并功能)
用Python实现ppt转化图片(附带长图合并功能) 前言笔者前一阵在学习数据相关的东西,从初学开始,一直在参加社区中的图表小挑战,此项活动是社区出题人给出一定官方数据,参加小挑战的人员可以对数据进 ...
微信小程序中 canvas 导出图片为黑色
今天写分享二维码时出现的坑,看见黑底时心都凉了半截,官方的说法是安卓中会把透明的底色绘制成黑色,所以解决方法是直接绘制一个底色就行了 ctx.setFillStyle("#fff" ...
微信小程序 Canvas导出图片模糊？（已解决）
首先确定 userInfo 的 avatar 不是 132,原图是 0: 其次确定你的 destWidth 和 destHeight 不是 width 和 height; width: 200,hei ...

【canvas】导出图片背景色

【canvas】导出图片背景色相关推荐

最新文章

热门文章