zoukankan      html  css  js  c++  java
  • 图片等比例缩放方法

    export modifyImageSize = (path, maxWidth, maxHeight, callback) => {
      /*
       * @param path 【图片路径】
       * @param maxWidth 【允许缩放的最大宽度】
       * @param maxHeight 【 允许缩放的最大高度】
       * @parsm callback 【回调缩放高度宽度】
       */
      /*
        @使用方法
        
        modifyImageSize(path,500,500,(res)=>{
          let { tempHeight, tempWidth } = res
          console.log('缩放之后高度:'+tempHeight)
          console.log('缩放之后宽度:'+tempWidth)
        })
      */
      let image = new Image();
      image.src = path;
      var tempWidth;
      var tempHeight;
      image.onload = function() {
        if (image.width > 0 && image.height > 0) {
          if (image.width / image.height >= maxWidth / maxHeight) {
            if (image.width > maxWidth) {
              tempWidth = maxWidth;
              tempHeight = (image.height * maxWidth) / image.width;
            } else {
              tempWidth = image.width;
              tempHeight = image.height;
            }
          } else {
            if (image.height > maxHeight) {
              tempHeight = maxHeight;
              tempWidth = (image.width * maxHeight) / image.height;
            } else {
              tempWidth = image.width;
              tempHeight = image.height;
            }
          }
          callback({
            tempWidth, // 缩放之后宽度
            tempHeight // 缩放之后高度
          })
        }
      }
    }
  • 相关阅读:
    关于TextField
    判断一个显示对象是否移除
    不争气的Discuz!NT 3.6和MVC3整合,主要实现同步登录和注册,登出。
    我的博客是英文的
    TFS不提供 Team Foundation 服务的解决办法。
    四 为提高entity framework 性能,要注意哪些事情.
    三 EF 和ado.net 的性能对比.
    一 关于大项目的经验总结
    在.net 中,ajax 如何调用本页数据源
    关于有序guid 的使用
  • 原文地址:https://www.cnblogs.com/wangsai-666/p/13927356.html
Copyright © 2011-2022 走看看