https://github.com/hustcc/alimask

:mask: alimask 是一个使用 canvas 生成类似阿里巴巴内部网站水印图片的 JavaScript 库。
https://github.com/hustcc/alimask

alibaba alimask antfin canvas mask page-watermark water watermark watermark-image

Last synced: 5 months ago
JSON representation

:mask: alimask 是一个使用 canvas 生成类似阿里巴巴内部网站水印图片的 JavaScript 库。

• Host: GitHub
• URL: https://github.com/hustcc/alimask
• Owner: hustcc
• License: mit
• Created: 2017-05-12T03:40:59.000Z (almost 8 years ago)
• Default Branch: master
• Last Pushed: 2018-08-23T12:17:54.000Z (over 6 years ago)
• Last Synced: 2024-11-09T22:43:58.301Z (5 months ago)
• Topics: alibaba, alimask, antfin, canvas, mask, page-watermark, water, watermark, watermark-image
• Language: JavaScript
• Homepage: http://git.hust.cc/alimask/
• Size: 13.7 KB
• Stars: 176
• Watchers: 7
• Forks: 46
• Open Issues: 6
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# alimask

> **alimask** 是一个使用 canvas 生成类似阿里巴巴内部网站水印图片的 JavaScript 库。Online demo [here](http://git.hust.cc/alimask/).

![](alimask.png)![](alimask.png)![](alimask.png)

[![Build Status](https://travis-ci.org/hustcc/alimask.svg?branch=master)](https://travis-ci.org/hustcc/alimask) [![npm](https://img.shields.io/npm/v/alimask.svg)](https://www.npmjs.com/package/alimask) [![npm](https://img.shields.io/npm/dt/alimask.svg)](https://www.npmjs.com/package/alimask) [![npm](https://img.shields.io/npm/l/alimask.svg)](https://www.npmjs.com/package/alimask)

# 1. Install

> **npm install alimask**

Then import it.

```js

// or

var alimask = require('alimask');

// or

import alimask from 'alimask';

```

Then use **alimask(text, options)** API.

```js

alimask('王小为(小为) 888888');

alimask('王小为(小为) 888888', { color: '#f6dcd7' });

alimask('小泥巴(小美) 888888', { alpha: 0.5 });

```

# 2. API

The unique API is: **alimask(text, options)**.

 

 - **text** (String): required, the text in the watermark image. 

 - **options** (Object): optional, the options of watermark, with keys below:

   - **width** (Number): default is `250`.

   - **height** (Number): default is `80`.

   - **color** (String): the text color, default is `#ebebeb`.

   - **alpha** (Float): the text alpha(0 ~ 1), default is `0.8`.

   - **font** (String): the text font style, default is `10px Arial`.

The api return **the base64 string of watermark image** which can be used in css background / img tag.

# 3. Build & Test

> npm install

> npm run build

> npm test

# 4. LICENSE

MIT @[hustcc](https://github.com/hustcc)