# water-plugin

**Repository Path**: isangle/water-plugin

## Basic Information

- **Project Name**: water-plugin
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-05-22
- **Last Updated**: 2024-05-22

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README



自适应文本长度生成网页水印，解决文本截断问题。灵活的文本旋转角度。自定义水印文本颜色样式。可全局水印，也可弹窗局部水印。还有为图片添加水印功能。

## Install
    npm i @javen_xu/watermark



## Quickstart
```vue
import watermark from '@javen_xu/watermark';
set('水印测试使用');
```

## set (text='',styleObj = {},canvasStyleObj = {} )
设置网页水印，无返回值
##### text:string      水印文本(必填) 
##### styleObj:object  样式（可选）
    id:string     水印div的id,默认waterMark，可用该id修改div背景色等
    size:string   文字大小，默认18 
    angle:Number  角度,-90~90,第一个字符为原点，顺时针为正值，逆时针为负值，默认-30
    type:string   水印文字类型，fill和stroke，默认fill


##### canvasStyleObj:object   canvas文本样式（可选）
    canvas的文本样式，参数同 canvas API
    font中的字体大小请和styleObj的size一致，否则会有文字截断问题


## setImgBack(backImg,text='',styleObj = {},canvasStyleObj = {})
```
import {setImgBack}  from '@javen_xu/watermark'; 
```
异步返回带水印图片的base64
##### backImg      原图(必填) 
图片的url或者base64
##### text:string  水印文本(必填)，同set

##### styleObj     样式（可选），同set
##### canvasStyleObj:object   canvas文本样式（可选），同set


## createImg(text='',styleObj = {},canvasStyleObj = {} )
```
import {createImg}  from '@javen_xu/watermark'; 
```
返回单张水印图的base64
##### text:string  水印文本(必填)，同set

##### styleObj     样式（可选），同set
##### canvasStyleObj:object   canvas文本样式（可选），同set