[![][npm-release-shield]][npm-release-link] [![][npm-downloads-shield]][npm-downloads-link] [![][package-size-shield]][package-size-link] [![][codecov-shield]][codecov-link]
[![][github-release-date-shield]][github-release-date-link] [![][github-action-build-shield]][github-action-build-link] [![][github-license-shield]][github-license-link] [![][gitter-shield]][gitter-link] [//]: # ( ) [//]: # ( ) [//]: # ( ) [//]: # ( ) [//]: # ( ) [//]: # ( )

Watermark

This is a canvas-based watermark for browser.

• 🛠️ Rich Features
• 🔑 Fully Typed APIs
• 📦️ Extremely light

Watermark works with both Vue 2 , Vue 3 And React.

Translations

• 中文文档

Installing

# or pnpm or yarn
npm install watermark-js-plus

Usage

Demo Collection

Watermark

import { Watermark } from 'watermark-js-plus'

const watermark = new Watermark({
  content: 'hello my watermark',
  width: 200,
  height: 200,
  onSuccess: () => {
    // success callback
  }
})

watermark.create()

Blind Watermark

import { BlindWatermark } from 'watermark-js-plus'

const watermark = new BlindWatermark({
  content: 'hello my watermark',
  width: 200,
  height: 200,
  onSuccess: () => {
    // success callback
  }
})

watermark.create()

Decode Blind Watermark

import { BlindWatermark } from 'watermark-js-plus'

BlindWatermark.decode({
  url: uploadFile.url, // image url
  onSuccess: (imageBase64) => {
    // success callback
  }
})

Documentation

To learn more, check its documentation.

Maintainers

@zhensherlock.

Contributing

Feel free to dive in! Open an issue or submit PRs.

Standard Readme follows the Contributor Covenant Code of Conduct.

Contributors

This project exists thanks to all the people who contribute.

License

MIT © MichaelSun