700字范文,内容丰富有趣,生活中的好帮手!
700字范文 > mui+hbuilder 将图片压缩并转变为base64 与改变图片尺寸大小来减小图片文件大小

mui+hbuilder 将图片压缩并转变为base64 与改变图片尺寸大小来减小图片文件大小

时间:2020-05-01 02:27:35

相关推荐

mui+hbuilder   将图片压缩并转变为base64 与改变图片尺寸大小来减小图片文件大小

//将图片压缩并转变为base64

convertImgToBase64:function(url,callback, bili){ //path绝对路径

var _this = this;

var bitmap = new plus.nativeObj.Bitmap(“test”); //test标识谁便取

// 从本地加载Bitmap图片

// alert(JSON.stringify(bitmap))

bitmap.load(url,function(){

var base4=bitmap.toBase64Data();

var datastr=base4.split(’,’,3);

_this.pics = [];

if(datastr.length>1){

_this.pics.push(datastr[1]);

}else {

_this.pics.push(datastr[0]);

}

_this.srcimg = “data:image/png;base64,”+ _this.pics[0];

var str = _this.srcimg.replace(‘data:image/png;base64,’, ‘’);

var equalIndex = str.indexOf(’=’);

if (str.indexOf(’=’) > 0) {

str = str.substring(0, equalIndex);

}

var strLength = str.length;

var fileLength = parseInt(strLength - (strLength / 8) * 2);

// 由字节转换为KB

var size = “”;

size = (fileLength / 1024).toFixed(2);

if(size>2048){

mui.toast(‘上传的图片不可大于2M’);

return;

}

callback(_this.srcimg);

},(e)=>{alert('加载图片失败:'+JSON.stringify(e));}); },

第二种

/打开相机功能,拿到照片的路径/

function getImage() {

var c = plus.camera.getCamera();

c.captureImage(function(e) {

plus.io.resolveLocalFileSystemURL(e, function(entry) {

var imgSrc = entry.toLocalURL() + “?version=” + new Date().getTime(); //拿到图片路径

drawImage(imgSrc);

vue.headerImage = [];

vue.headerImage.push(imgSrc);

}, function(e) {

console.log(“读取拍照文件错误:” + e.message);

});

}, function(s) {

console.log(“error” + s);

}, {

filename: “_doc/camera/”

})

};

/** 打开手机相册,从中选取图片 **/

function galleryImg(){

// 从相册中选择图片

plus.gallery.pick( function(e){

console.log(JSON.stringify(e))

vue.headerImage = [];

vue.headerImage.push(e);

drawImage(e);

}, function (e) {

console.log( “取消选择图片” );

},{

filter: “image”,

multiple: false,

maximum: 1,

system: false,

onmaxed: function() {

plus.nativeUI.toast(‘只能选择1张图片’);

}

});

};

//自动生成四个尺寸的图片

function drawImage(img){

draw(750, 356, img,function(imgdata){

banner = imgdata;

});

draw(240,180,img, function(imgdata){

recommend = imgdata;

});

draw(350,490,img, function(imgdata){

big_recommend = imgdata;

});

draw(350,240, img, function(imgdata){

small_recommend = imgdata;

});

};

var equipmentType = "";var agent = navigator.userAgent.toLowerCase();var android = agent.indexOf("android");var iphone = agent.indexOf("iphone");// var ipad = agent.indexOf("ipad");//iosif(iphone != -1){equipmentType = "ios";function draw(w,h,imgSrc,fn){var c=document.createElement('canvas'),ctx=c.getContext('2d');var imgDataBase = null;c.width= w;c.height= h;ctx.rect(0,0,c.width,c.height);ctx.fillStyle='#fff';ctx.fill();var img = new Image;img.src = imgSrc;img.onload = function(){var oW = img.width;var oH = img.height;var x=0,y=0;var cW = c.width;var cH = c.height;var scale = 0; //定义一个缩放倍数//定义画布和图片的宽高比var cRatio = w/h;var oRatio = oW/oH;if(cRatio<=oRatio){scale = h/oH;y = 0;x = (oW*scale - w)/2;}else{scale = w/oW;x = 0;y = (oH*scale - h)/2;};ctx.drawImage(img, -x, -y, oW*scale, oH*scale);var bitmap = new plus.nativeObj.Bitmap("test"); //test标识谁便取// 从本地加载Bitmap图片 bitmap.load(imgSrc,function(){ var base4=bitmap.toBase64Data(); var datastr=base4.split(',',3); imgDataBase = "data:image/png;base64,"+ datastr;var str = imgDataBase.replace('data:image/png;base64,', '');var equalIndex = str.indexOf('=');if (str.indexOf('=') > 0) {str = str.substring(0, equalIndex);}var strLength = str.length;var fileLength = parseInt(strLength - (strLength / 8) * 2);// 由字节转换为KBvar size = "";size = (fileLength / 1024).toFixed(2);if(size>2048){mui.toast('上传图片不可大于2M');return;}fn(imgDataBase);},(e)=>{alert('加载图片失败:'+JSON.stringify(e));}); };};}else if(android != -1){equipmentType = "android";function draw(w,h,imgSrc,fn){var c=document.createElement('canvas'),ctx=c.getContext('2d');var imgDataBase = null;c.width= w;c.height= h;ctx.rect(0,0,c.width,c.height);ctx.fillStyle='#fff';ctx.fill();var img = new Image;img.src = imgSrc;img.onload = function(){var oW = img.width;var oH = img.height;var x=0,y=0;var cW = c.width;var cH = c.height;var scale = 0; //定义一个缩放倍数//定义画布和图片的宽高比var cRatio = w/h;var oRatio = oW/oH;if(cRatio<=oRatio){scale = h/oH;y = 0;x = (oW*scale - w)/2;}else{scale = w/oW;x = 0;y = (oH*scale - h)/2;};ctx.drawImage(img, -x, -y, oW*scale, oH*scale); imgDataBase = c.toDataURL("image/png",0.8);// console.log(imgDataBase)fn(imgDataBase);};};}

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。