@neosjs/merge-images

将多个图像合并成一个图像

安装

npm install @neosjs/merge-images

使用方法

import mergeImages from '@neosjs/merge-images'

const images = [
  'https://example.com/image1.png',
  'https://example.com/image2.png',
  'https://example.com/image3.png',
]

mergeImages(images, {
  width: 800,
  height: 600,
  format: 'image/png',
  quality: 1,
  crossOrigin: 'anonymous',
}).then((base64: string) => {
  console.log(base64)
})

参数

| 参数 | 说明 | 类型 | 可选值 | 默认值 | | :--- | :--- | :---: | :---: | :---: | | images | 图像列表 | Array<Source | string> | - | - | | options | 配置项 | Options | - | - | | options.width | 合并后的图像宽度 | number | - | - | | options.height | 合并后的图像高度 | number | - | - | | options.format | 输出图像格式 | string | 'image/png'、'image/jpeg'、'image/webp' | 'image/jpeg' | | options.quality | 输出图像质量 | number | 0 ~ 1 | 0.75 | | options.crossOrigin | 跨域属性 | string | 'anonymous'、'use-credentials' | 'anonymous' |

接口类型

export interface Options {
  format?: string
  quality?: number
  width?: number | undefined
  height?: number | undefined
  Canvas?: any
  crossOrigin?: string
  Image?: any
  [key: string]: any
}
export interface Source {
  src?: string
  x?: number
  y?: number
  opacity?: number
}