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 // 缩放之后高度
          })
        }
      }
    }
  • 相关阅读:
    真不容易...终于我也有了个js的语法高亮
    持久层相关概念
    测试语法高亮显示
    BSTR简介和内部结构
    Debugging JavaScript in Your Applications
    Google Analytics 跟踪代码迁移手册
    我对事件驱动的理解
    imagettftext 可调整字间距输出
    投票机的实现及相关技术
    js光标定位到文本末尾
  • 原文地址:https://www.cnblogs.com/wangsai-666/p/13927356.html
Copyright © 2011-2022 走看看