imagecmp v1.0.2

图片压缩

npm i imagecmp --save

# or 

yarn add imagecmp

Include the library

in CommonJS:

const imageCmp = require("imagecmp");

in ES6:

import * as imageCmp from 'imagecmp';

or

import {compress, compressAccurately} from 'imagecmp';

Use examples

<input id="demo" type="file" onchange="view()">

1. 将图片压缩到200kb

function view(){
  const file = document.getElementById('demo').files[0];
  console.log(file);
    imagecmp.compressAccurately(file,200).then(res=>{
    console.log(res);
  })
}

// or use an async function
async function view() {
  const file = document.getElementById('demo').files[0];
  console.log(file);
  const res = await imagecmp.compressAccurately(file,200)
  console.log(res);
}

2. 按质量压缩，降低图片质量

function view(){
  const file = document.getElementById('demo').files[0];
  console.log(file);
    imagecmp.compress(file,0.9).then(res=>{
    console.log(res);
  })
}

方法：

根据体积压缩File（Blob）对象 ----将图片压缩到多大----

方法：compressAccurately(file, config = {})

参数说明：
    file：一个File（Blob）对象
    config{number | object}：如果传入是number类型，则指定压缩图片的体积,单位Kb;也可以传入object类型，以便更详细的配置
        
        size<number>: 100, //图片压缩体积，单位Kb （！！！！！！！必填项！！！！！！！！）
        accuracy<number>: 0.9, //图片压缩体积的精确度，默认0.95
        type<string>："image/png", //转换后的图片类型，选项有 "image/png", "image/jpeg", "image/gif"
        width<number>: 300, //生成图片的宽度
        height<number>: 200, //生产图片的高度
        scale<number>: 0.5, //相对于原始图片的缩放比率,设置config.scale后会覆盖config.width和config.height的设置；
        orientation<number>:2, //图片旋转方向
            1: 0°
            2: 水平翻转
            3: 180°
            4: 垂直翻转
            5: 顺时针90°+水平翻转
            6: 顺时针90°
            7: 顺时针90°+垂直翻转
            8: 逆时针90°
            
方法返回：压缩后的blob图片对象            

压缩File（Blob）对象（压缩图片质量，会模糊）

方法：compress(file, config = {})

参数说明：
    file<Blob>：一个File（Blob）对象
    config{number|object}：如果传入是number类型，传入范围 0-1，表示图片压缩质量,默认0.92；也可以传入object类型，以便更详细的配置
        imageConversion.compress(file,0.8)

  		imageConversion.compress(file,{
  			quality: 0.8, //图片压缩质量 （！！！！！！必填项！！！！！！！）
  			type："image/png", //转换后的图片类型，选项有 "image/png", "image/jpeg", "image/gif"
  			width: 300, //生成图片的宽度
  			height：200， //生产图片的高度
  			scale: 0.5， //相对于原始图片的缩放比率,设置config.scale后会覆盖config.width和config.height的设置；
  			orientation:2, //图片旋转方向
  		})
  		
方法返回：压缩后的blob图片对象  		

将bolo类型数据转成file类型数据

方法：blobToFile(theBlob, fileName)

参数说明：
    theBlob：bolo类型数据
    fileName：转换之后的文件名称
    
方法返回：file对象   

将一个Canvas对象转变为一个dataURL字符串

方法：canvastoDataURL(canvasObj, quality = 0.92, imgtype = 'jpeg')

参数说明：
   canvasObj：canvas对象
   quality<number>：传入范围 0-1，表示图片压缩质量，默认0.92
   imgtype<string>：确定转换后的图片类型，选项有 "image/png", "image/jpeg", "image/gif",默认"image/jpeg" 
   
方法返回： base64位的图片地址  

将一个canvas对象转变为一个File（Blob）对象

方法：canvastoFile(canvasObj, quality = 0.92, imgtype = 'jpeg')

参数说明：
    canvasObj：canvas对象
    quality<number>：传入范围 0-1，表示图片压缩质量，默认0.92
    imgtype<string>：确定转换后的图片类型，选项有 "image/png", "image/jpeg", "image/gif",默认"image/jpeg" 

方法返回：blob对象

将一个dataURL字符串转变为一个File（Blob）对象

方法：dataURLtoFile(dataURL, imgtype) 

参数说明：
    dataURL：base64格式的图片地址
    imgtype<string>：确定转换后的图片类型，选项有 "image/png", "image/jpeg", "image/gif",默认"image/jpeg" 

方法返回：blob对象

将dataURL字符串转变为image对象

方法：dataURLtoImage(dataURL)

参数说明：
    dataURL：base64格式的图片地址
    
方法返回：img对象    

将图片下载到本地

方法：downloadFile(file, fileName)

参数说明：
    file：一个File（Blob）对象
    fileName：下载后的文件名（可选参数，不传以时间戳命名文件）
   

将File（Blob）对象转变为一个dataURL字符串

方法：filetoDataURL(file)

参数说明：
    file：一个File（Blob）对象
    
方法返回：base64格式的图片地址    

将一个image对象转变为一个canvas对象

方法： imagetoCanvas(imageObj,config={})

参数说明：
    imageObj ： img对象
    config ：接受一个对象
        width<number> ：canvas图像的宽度，默认为image的宽度
        height<number> ：canvas图像的高度，默认为image的高度
        scale<number> ： 相对于image的缩放比例，范围0-10，默认不缩放
        orientation<number> ：图片旋转参数，默认不旋转，参考如下
            1: 0°
            2: 水平翻转
            3: 180°
            4: 垂直翻转
            5: 顺时针90°+水平翻转
            6: 顺时针90°
            7: 顺时针90°+垂直翻转
            8: 逆时针90°
  
 方法返回：canvas对象

通过一个图片的url加载所需要的File（Blob）对象

方法：urltoBlob(url)

参数说明：
    url：图片url
    
方法返回：blob对象    

通过一个图片的url加载所需要的image对象

方法：urltoImage(url)

参数说明：
    url：图片URL
    
方法返回：img对象