zoukankan      html  css  js  c++  java
  • nodejs裁剪图片

    场景

    • 很多长图大图需要裁剪成多张小图

    用到的npm包

    • jimp,用于Node的图像处理库,完全使用JavaScript编写,零本地依赖项。

    代码实现

    const Jimp = require('jimp');
    
    /**
     * url 目标图片,需要裁减的图片
     * files 裁剪过后的文件路径,根据文件路径的个数平均切成n等份
     * isVertical 是否纵向均切,默认为true,false就是横向切图
     */
    const clipImage = (url, files, isVertical = true) => {
      Jimp.read(url, (err, image) => {
        if(err) {
          console.log(err);
          return;
        }
        const { bitmap = {} } = image;
        const { width, height } = bitmap;
        const len = files.length;
        const delta = isVertical ? (height / len) : (width / len);
        async function cropVerticalOne(i) {
          const file = files[i];
          const _image = image.clone();
          await _image.crop(0, delta * i, width, delta)
                     .write(file);
          if(i < len - 1) {
            cropVerticalOne(i + 1);
          }           
        }
        async function cropHorizontalOne(i) {
          const file = files[i];
          const _image = image.clone();
          await _image.crop(delta * i, 0, delta, height)
                     .write(file);
          if(i < len - 1) {
            cropHorizontalOne(i + 1);
          }           
        }
        isVertical ? cropVerticalOne(0) : cropHorizontalOne(0);
      })
    }
    
    clipImage('water.png', ['water1.png', 'water2.png', 'water3.png', 'water4.png'], false);
    clipImage('water.png', ['water5.png', 'water6.png', 'water7.png', 'water8.png'], true);
    
    ### 小结
    
    - 好记性不如烂笔头,先记下来,以后有遇上需要使用的场景可以深入了解一下
    
  • 相关阅读:
    430flash的操作
    430单片机之定时器A功能的大致介绍
    MSP430看门狗
    430之通用异步串口通信模块
    430的启动,I/O中断
    Msp430概述
    烦躁
    12864密码锁
    单片机的动手实践篇--51单片机玩转12864
    【CSS】font样式简写(转)- 不是很建议简写
  • 原文地址:https://www.cnblogs.com/aloneMing/p/13474359.html
Copyright © 2011-2022 走看看