设置canvas的背景成白色

解决方案一:将透明的pixel设成白色

因为png图片的背景都是透明的,所以我们可以寻找透明的pixel,然后将其全部设置成白色,核心代码如下:

JavaScript Code复制内容到剪贴板

// 将canvas的透明背景设置成白色

var imageData = context.getImageData(0, 0, canvas.width, canvas.height);

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;

}

}

context.putImageData(imageData, 0, 0);

其他方法见https://m.aliyun.com/jiaocheng/646601.html

原文地址:https://www.cnblogs.com/qinmengjiao123-123/p/10300623.html

时间: 2024-11-11 15:33:42

设置canvas的背景成白色的相关文章

怎么把CAD背景色设置成白色

怎么把CAD背景色设置成白色?大家都知道,在CAD中的背景颜色一打开就是默认的是黑色的背景,但是在绘图图纸的时候,我们使用的线条也是黑色的,那为了区分开,就需要更改CAD的背景色.怎么把CAD背景色设置成白色?大家知道具体要怎么操作吗?下面我们就来看看具体的操作方法吧. 第一步:首先,在电脑桌面中没有安装CAD编辑器的,在电脑桌面上任意的使用一个浏览器,可以在浏览器中搜索迅捷CAD编辑器,在搜索的结果中进入官网,点击下载安装最新版本的CAD编辑器. 第二步:启动该软件进入到首页,之后点击"文件&

设置背景为白色,避免从A视图跳转到B视图的时候出现卡顿

- (void)viewDidLoad { [super viewDidLoad]; self.view.backgroundColor = [UIColor whiteColor]; } 设置背景为白色,避免从A视图跳转到B视图的时候出现卡顿

canvas之背景特效

需具备js基础知识以及canvas相关方法(可查阅相关文档) 下面是一篇有关js与canvas的背景特效 基于面向过程的思维 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> *{ margin: 0; padding: 0; } #canvas { displ

怎么将CAD看图软件背景色改成白色?

怎么将CAD看图软件背景色改成白色?在打开一张CAD图纸文件进行查看的时候,有的背景颜色不适合那就需要更改CAD看图软件的背景色,但是怎么将CAD看图软件的背景色改成白色?具体要怎么来进行操作了,下面小编就来教教大家具体操作方法,想要了解的朋友也可以来看看,希望能够帮助到你们. 第一步:首先要打开您电脑上面的CAD看图软件,如果您电脑上面没有这款CAD看图软件的话,可以在电脑中任意的打开一个浏览器,在浏览器的搜索框中 搜索迅捷CAD看图,点击官网进行,下载安装最新版本的CAD看图软件. 第二步:

1-10(退出键盘,设置按钮的背景图,transform属性,imageView序列帧动画,九宫格算法...)

(1-10目录) 1.取得2个文本输入框的值 2.退出键盘 3.设置按钮的背景图 4.执行动画 5.手动创建按钮以及设置按钮的一些基本属性 6 transform属性 7.imageView序列帧动画 8.九宫格算法 9.通过xib创建局部控件,利用模型封装加载数据 10设置状态栏的样式为白色 { 扯淡环节: 工作这么久了, 发现一些细节有时候总是忽略, 现在就把我刚接触时的知识点给整理出来!, 没事自己看看, 也分享给大家! 分享,创造快乐!哈哈 xq每天都生活在快乐当中, 愿你们也是! }

获取bing图片并自动设置为电脑桌面背景(使用 URLDownloadToFile API函数)

众所周知,bing搜索网站首页每日会更新一张图片,张张漂亮(额,也有一些不合我口味的),特别适合用来做电脑壁纸. 我们想要将bing网站背景图片设置为电脑桌面背景的通常做法是: 上网,搜索bing 找到图片的下载链接,并下载之 将图片设置为桌面背景(也有部分浏览器支持直接在网页中右击图片设置为壁纸) 可能你还会删除下载下来的图片 作为一枚coder,你不会觉得麻烦嘛?至少需要三个步骤呢! So...我就用C++语言写了一个小程序,用于获取bing网站的图片,并将其设置为桌面背景.整个过程只需要点

设置canvas元素的宽高的奇妙(jiujie)发现

大家都知道设置一块画布的大小 我们可以这样: <canvas id="canvas" width="600" height="300"> </canvas> 也可以通过css进行设置 #canvas{ width:600px; height:300px; } 我这样写: 效果是这样: 可当我在css上也写上同样的尺寸并把canvas元素行内宽高去掉的时候..... hellow变的贼大..明明都是一样的尺寸. 好吧,其实:

CSS3:用CSS设置多个背景、背景渐变、指定背景大小

http://blog.csdn.net/net_lover/article/details/5212026 CSS3规范中对背景这一部分,新加入了一些令人兴奋的功能,如可以设置多个背景图片.可以指定背景大小.设置背景渐变等功能.CSS3规范中定义的背景属性有: 属性名 可能的值 默认值 background 是一种简写方式:bg-image || bg-position || / bg-size || repeat-style || attachment || bg-origin,最后一个背景

linux BASH shell下设置字体及背景颜色

BASH shell下设置字体及背景颜色 echo -e "\e[31mtest\e[41m" \e[30m 将字符的显示颜色改为黑色 \e[31m 将字符的显示颜色改为红色 \e[32m 将字符的显示颜色改为绿色 \e[33m 将字符的显示颜色改为淡红色 \e[34m 将字符的显示颜色改为蓝色 \e[35m 将字符的显示颜色改为紫色 \e[36m 将字符的显示颜色改为淡蓝色 \e[37m 将字符的显示颜色改为灰色 \e[40m -- \e[47m 设置背景色 \e[40m 将背景色设