解决方案一:将透明的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

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

  1. (转载)Recyclerview | Intent与Bundle在传值上的区别 | 设置布局背景为白色的三种方法

    用Recyclerview实现列表分组.下拉刷新以及上拉加载更多  http://www.jianshu.com/p/be62ce21ea57 Intent与Bundle在传值上的区别http://b ...

  2. canvas之背景特效

    需具备js基础知识以及canvas相关方法(可查阅相关文档) 下面是一篇有关js与canvas的背景特效 基于面向过程的思维 <!DOCTYPE html> <html> &l ...

  3. 使用Canvas绘制背景图

    原文  http://www.imququ.com/post/use-canvas-as-background-image.html 最近iCloud Web的Beta版换了UI,整体风格变得和iOS ...

  4. linux BASH shell设置字体与背景颜色

    linux BASH shell下设置字体及背景颜色的方法. BASH shell下设置字体及背景颜色  echo -e "\e[31mtest\e[41m"  \e[30m 将字 ...

  5. 获取bing图片并自动设置为电脑桌面背景(C++完整开源程序)

    众所周知,bing搜索网站首页每日会更新一张图片,张张漂亮(额,也有一些不合我口味的),特别适合用来做电脑壁纸. 我们想要将bing网站背景图片设置为电脑桌面背景的通常做法是: 上网,搜索bing 找 ...

  6. 【开源程序(C++)】获取bing图片并自动设置为电脑桌面背景

    众所周知,bing搜索网站首页每日会更新一张图片,张张漂亮(额,也有一些不合我口味的),特别适合用来做电脑壁纸. 我们想要将bing网站背景图片设置为电脑桌面背景的通常做法是: 上网,搜索bing 找 ...

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

    BASH shell下设置字体及背景颜色 echo -e "\e[31mtest\e[41m" \e[30m 将字符的显示颜色改为黑色 \e[31m 将字符的显示颜色改为红色 \e ...

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

    众所周知,bing搜索网站首页每日会更新一张图片,张张漂亮(额,也有一些不合我口味的),特别适合用来做电脑壁纸. 我们想要将bing网站背景图片设置为电脑桌面背景的通常做法是: 上网,搜索bing 找 ...

  9. 使用CSS设置边框和背景

    一.设置边框 1.边框样式 属性 说明 border-width 设置边框的宽度 boder-style 设置边框的样式 border-color 设置边框的颜色 a.border-width属性 自 ...

随机推荐

  1. linux安装最新(任意)版本nodejs

    首先在终端中使用命令 uname -a 查看系统版本 uname -a x86_64 是64位的 所以要安装64位对应的nodejs 打开nodejs中文网里的下载 找到64位的文件 点击后就下载了 ...

  2. jQuery笔记(五)jQuery表单验证

    前言 上次我们说完jQuery中的动画之后,我们再来看一种jQuery在Web网页应用最为广泛的一种形式,这就是jQuery对表单的操作,通过jQuery对表单的操作,可以有效的提高用户体验.在此之前 ...

  3. CF895C Square Subsets [线性基]

    线性基的题- 考虑平方数只和拆解质因子的个数的奇偶性有关系 比如说你 \(4\) 和 \(16\) 的贡献都是一样的.因为 \(4 = 2^2 , 16 = 2^4\) \(2\) 和 \(4\) 奇 ...

  4. 【巨杉数据库SequoiaDB】省级农信国产分布式数据库应用实践

    本文转载自<金融电子化> 原文链接:https://mp.weixin.qq.com/s/WGG91Rv9QTBHPsNVPG8Z5g 随着移动互联网的迅猛发展,分布式架构在互联网IT技术 ...

  5. 金蝶云星空Python案例地址

    https://club.kingdee.com/forum.php?mod=viewthread&tid=1235461

  6. 常用的一些git命令整合

    一.创建一个版本库 1.mkdir xxx 2.git init 使用git init命令将这个目录变成Git可以管理的仓库 这个版本仓库创建好了,xxx目录下有一个隐藏的.git目录(里面有暂存区( ...

  7. C语言实现 循环队列

    #include <stdio.h>#include <stdlib.h>#include <stdbool.h> typedef struct queue{ in ...

  8. 获取redis指定实例中所有的key

    需求:获取redis指定的实例中所有的key的名字. 千万不要使用keys *,可以使用scan命令的递归方式获取. 以下给出自己写的脚本,经过测试效果还可以. db_ip=5.5.5.101 db_ ...

  9. ASP.NET MVC5 的请求管道和运行生命周期

    https://www.jianshu.com/p/848fda7f79e0 请求处理管道 请求管道是一些用于处理HTTP请求的模块组合,在ASP.NET中,请求管道有两个核心组件:IHttpModu ...

  10. CTF入门 |“男神”背后的隐写术

    刚刚开始学CTF,记录一下做的第一道隐写题 ~ 附件下载 题目背景(我自己瞎编的): Luyu是CPPU的校草,一直以来他的写真照被各届校友广泛流传,最近江湖上流传着拿到这些照片就能知道Luyu的QQ ...