1.1.2 • Published 4 years ago
@zu1662/watermark
Licence
MIT
Version
1.1.2
Deps
0
Size
71 kB
Vulns
0
Weekly
0
@zu1662/watermark
页面水印核心SDK
使用
# npm
npm install @zu1662/watermark
# yarn
yarn add @pansy/watermark
import { Watermark } from '@zu1662/watermark';
const watermark = new Watermark({ ... });
// 如果需要修改水印参数,请调用
watermark.update({ ... });
// 隐藏水印
watermark.hide();
// 显示水印
watermark.show();
// 销毁水印
watermark.destroy();
API
基本参数
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| visible | 水印是否显示 | boolean |
true |
| useClientHeight | 是否使用元素或者父元素的ClientHeight | boolean |
false |
| image | 图片源,建议导出 2 倍或 3 倍图,优先使用图片渲染水印 | string |
- |
| text | 水印文本, 为数组时表示多行水印 | string | string[] |
- |
| zIndex | 水印层级 | number |
9999 |
| width | 单个水印宽度 | number |
120 |
| height | 单个水印高度 | number |
64 |
| opacity | 水印透明度 | number |
0.15 |
| rotate | 旋转的角度 | number |
-22 |
| fontSize | 设置字体大小 | number |
16 |
| fontWeight | 设置字体粗细 | number | string |
normal |
| fontStyle | 规定字体样式 | string |
normal |
| fontVariant | 规定字体变体 | string |
normal |
| fontColor | 设置字体颜色 | string |
#000 |
| fontFamily | 设置水印文字的字体 | string |
sans-serif |
高级参数
| 参数 | 说明 | 类型 | 默认值 |
|---|---|---|---|
| monitor | 是否开启保护模式 | boolean |
true |
| mode | 展示模式,interval表示错行展示 | string |
interval |
| gapX | 水印之间的水平间距 | number |
100 |
| gapY | 水印之间的垂直间距 | number |
100 |
| offsetLeft | 水印在 canvas 画布上绘制的水平偏移量 | number |
0 |
| offsetTop | 水印在 canvas 画布上绘制的垂直偏移量 | number |
0 |
| width | 单个水印宽度 | number |
120 |
| height | 单个水印高度 | number |
64 |