zoukankan      html  css  js  c++  java
  • js利用html5的canvas实现图像等比例压缩

    function getBase64Image(img) {
          var readImg = new FileReader();
          readImg.readAsDataURL(img);
          readImg.onload = function (readEvent){
           var base64="";
           if(img.size>524288){
           var tmpimg = new Image;
           var quality = 0.9;
           var cv = document.createElement("canvas");
           var drawer = cv.getContext("2d");
           tmpimg.src = this.result;
           cv.width=tmpimg.width/4;
           cv.height=tmpimg.height/4;
           drawer.drawImage(tmpimg, 0, 0,cv.width,cv.height);
                 var tmpsrc = cv.toDataURL("image/jpeg", quality);
                 //console.log(tmpsrc);
                 base64 = tmpsrc;
                 //alert(1);
          }else{
           base64 = readEvent.target.result;
           //alert(2);
       }
          //.substr(23);  // base64字符串   
          //var base64 = readEvent.target.result;
          $("#image").attr("src", base64);
          $.ajax({
          type:"post",
          url:"../sendBase.ilf",
          data:{
           "bases":base64,
           "name":img.name,
           "uuid":uuid
         },
          dataType:"json",
          async:false,
          success:function(data){
           if(data == "1"){
            console.log("Upload Success!");
            success=success+1;
            //alert(success+"--"+length);
          if(success==length){
           length=0;
           success=0;
           alert("Upload Success!");
          }
          allFiles=null;
          imgFile=null;
          $("#image").empty();
           }else{
            console.log("Upload failure!");
            alert("Upload failure!");
            allFiles=null;
          imgFile=null;
          $("#image").empty();
           }
          }
         }); 
          };
     } 

  • 相关阅读:
    Spring Boot学习笔记
    打造高效率的软件测试
    如何将测试结果在jenkins上发布
    如何在docker container中运行web自动化测试
    Jmeter中随机读取测试文件的内容
    如何提高UI自动化测试的质量
    mac系统上添加定时任务
    keypass口令管理实践
    GPG实践
    树的遍历
  • 原文地址:https://www.cnblogs.com/rookie-ray/p/11188176.html
Copyright © 2011-2022 走看看