image-permutation
一个图片排列工具
安装
npm i --save image-permutation
基本使用
<script src="https://unpkg.com/image-permutation/dist/image-permutation.umd.js"></script><script>var source =sourcecrossOrigin = 'anonymous';source {const config =width: 100rotate: 0cross: truemirror:x: falsey: falserandom:width: 0rotate: 0gutter:horizontal: 20vertical: 201000 1000 '#ff0000' source config}sourcesrc = "./item.png"</script>
参数
new ImagePermutation(width, height, backgroundColor, source, config)
属性 | 说明 | 数据类型 | 默认值 |
---|---|---|---|
width | canvas内部的宽度 | number |
- |
height | canvas内部的高度 | number |
- |
backgroundColor | canvas背景颜色 | string |
#fff |
source | 插入的image对象数组 | Array |
[] |
config | 配置文件 | Json |
{} |
config数据结构
{ width: 100, // 插入image宽度 rotate: 0, // image旋转角度 cross: true, // 是否穿插渲染 mirror: { // 镜像渲染 x: false, // x轴镜像 y: false // y轴镜像 }, random: { // 随机渲染 width: 0, // 宽度随机增量 rotate: 0 // 角度随机增量 }, gutter: { // 间隔 horizontal: 20, // 水平间隔 vertical: 20, // 垂直间隔 }}