canvas将图片转成base64格式 以及 验证图片是否透明
logoImgUpload:function(file) {
let self = this;
self.formatUpload(file);
let reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = function (e) {
var img = new Image();
img.src = e.target.result;
self.isAlphaBackground = false;
// 缩放图片需要的canvas
var canvas = document.createElement('canvas');
var context = canvas.getContext('2d'); // base64地址图片加载完毕后
img.onload = function () {
// 图片原始尺寸
var originWidth = this.width;
var originHeight = this.height;
// canvas尺寸设置
canvas.width = originWidth;
canvas.height = originHeight;
// 清除画布
context.clearRect(0, 0, originWidth, originHeight);
// 图片绘制在画布上
context.drawImage(img, 0, 0);
// 获取图片像素信息
var imageData = context.getImageData(0, 0, originWidth, originHeight).data;
// 检测有没有透明数据
self.isAlphaBackground = false;
for (var index = 3; index < imageData.length; index += 4) {
if (imageData[index] != 255) {
self.isAlphaBackground = true;
break;
}
}
// isAlphaBackground就是最后石头有透明或半透明背景色的结果
console.log(self.isAlphaBackground)
};
self.design.logo = e.target.result;
}
return false;
},
canvas将图片转成base64格式 以及 验证图片是否透明的更多相关文章
- data:image/png;base64 上传图像将图片转换成base64格式
大家可能注意到了,网页上有些图片的src或css背景图片的url后面跟了一大串字符,比如: data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJ ...
- 图片转成base64位 页面中图片展示
<img src="data:image/gif;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAABG ...
- java 图片转换成base64字符串
import java.io.ByteArrayOutputStream; import java.io.FileInputStream;import java.io.FileOutputStream ...
- C++读写图片数据转成Base64格式的一种方法
最近在一个项目中要实现在客户端和服务端之间传送图片文件的功能,采用了C++语言读写图片转化成Base64格式进行传输.具体代码如下: //++Base64.h #pragma once class C ...
- 图片转换成Base64编码集成到html文件
首先为什么要这么做? 原因很简单这样可以减少与服务器的请求,当然对于一些浏览器并不支持,如IE8.通常用在手机版网站中,具体转化方法如下: 1.在线打开Base64的编码器将图片编码成Base64 ...
- js绝对地址图片转换成base64的方法
//将图片转换成base64 function getBase64Image(url, callback){ var canvas = document.createElement('canvas') ...
- delphi将图片转换成Base64编码函数
{************************************************************************** 名称: BaseImage 参数: fn: TF ...
- ABBYY如何把图片转换成pdf格式
在制作工作文件的时候,有时候会遇到需要进行文件格式转换的情况,比较常见的文件格式转换就包含了Office与pdf格式之间的转换.但除此之外,图片与pdf格式也是可以进行转换的,那么图片要怎么操作,才能 ...
- JS将图片转换成Base64码
直接上代码 html页面代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset= ...
随机推荐
- easyui 自定义验证规则 验证用户是否已经存在 远程ajax验证
easyui远程ajax验证 2014年09月30日 22:29:32 clj198606061111 阅读数:6130 标签: easyui 更多 个人分类: jqueryeasyui 版权声明:本 ...
- Java知多少(69)面向字节的输入输出流
字节流以字节为传输单位,用来读写8位的数据,除了能够处理纯文本文件之外,还能用来处理二进制文件的数据.InputStream类和OutputStream类是所有字节流的父类. InputStream类 ...
- (原)关于i++和++i的小程序测试
今天看到一个程序,于是用vs运行了一下,结果出乎我的意料: 代码: ; +(i++))+(+(i++)); i=; +(++i))+(+(++i)); i=; printf("x=%d,y= ...
- golang获取命令行参数
部署golang项目时难免要通过命令行来设置一些参数,那么在golang中如何操作命令行参数呢?可以使用os库和flag库. 1.golang os库获取命令行参数 os可以通过变量Args来获取命令 ...
- titlesplit
/** * Created by lkl on 2017/6/26. *///spark-shell --driver-class-path /home/hadoop/test/mysqljdbc.j ...
- DevExpress MemoEdit定位到末尾
1: /// <summary> 2: /// 追加文本到MemoEdit中 3: /// </summary> 4: /// <param name="mem ...
- 【CF679D】Bear and Chase 最短路+乱搞
[CF679D]Bear and Chase 题意:近日,鼠国的头号通缉犯,神出鬼没的怪盗——Joker正于摩登市出没!对于名侦探Jack来说,这正是将其捉拿归案的大号时机.形式化地,摩登市可以看成一 ...
- solus 系统 - 更新软件源
清华稳定源sudo eopkg ar Tuna https://mirrors.tuna.tsinghua.edu.cn/solus/shannon/eopkg-index.xml 清华不稳定源sud ...
- 阿里云服务器 通过JavaMail发送邮箱STMP问题 25端口被禁用 使用SSL协议465端口
1 问题描述 我们传统使用的比较简单的是 STMP 25端口收发邮件 今天发现刚购买的阿里云服务器不能作为客户端通过STMP 25端口发送邮件 开始在网上有说发现是JDK1.8的原因,然后自己也把JD ...
- 逻辑卷管理LVM(logical volume manager)
LVM的全名是logical volume manager,中文翻译逻辑卷管理器.之所以称为卷是因为可以将文件系统像卷一样伸长和缩短,LVM的做法是将几个物理的分区(或磁盘)通过软件组合成为一块独立的 ...