@acrodata/watermark
TypeScript icon, indicating that this package has built-in type declarations

1.2.0 • Public • Published

Watermark

npm license

Add watermark to your page.

Quick links

Documentation | Playground

Installation

npm install @acrodata/watermark --save

Usage

import { Component } from '@angular/core';
import { WatermarkDirective, WatermarkOptions } from '@acrodata/watermark';

@Component({
  selector: 'your-app',
  template: `
    <div watermark [watermarkOptions]="options">
      <p>...</p>
    </div>
  `,
  standalone: true,
  imports: [WatermarkDirective],
})
export class YourAppComponent {
  options: WatermarkOptions = {
    text: '...',
  };
}

API

Inputs

Name Type Default Description
[options] WatermarkOptions {} See WatermarkOptions
[container] HTMLElement | string | null undefined See WatermarkOptions['container']
[secure] boolean true See WatermarkOptions['secure']
[zIndex] number 9999 See WatermarkOptions['zIndex']
[scrollHeight] string |number undefined See WatermarkOptions['scrollHeight']

WatermarkOptions

Name Type Default Description
container HTMLElement | string | null undefined Container of the watermark
secure boolean true Whether prevent the watermark being removed
image string undefined Image source of the watermark, it's recommended to use 2x or 3x image
text string | string[] undefined Text of the watermark and dispaly multiple lines with using array
blindText string undefined Text of the blind-watermark
blindFontSize string | number 16 Font size of the blind-watermark
blindOpacity boolean 0.005 Opacity of the blind-watermark
repeat 'none' | 'normal' | 'multiply' multiply Specify how watermarks are repeated
position string undefined Specify background-position of the watermark
zIndex number 9999 Specify z-index of the watermark
scrollHeight number | string undefined Specify the height of watermark in a scroll container
gapX number 100 Horizontal gap of watermark contents
gapY number 100 Vertical gap of watermark contents
offsetX number 0 Horizontal offset of the watermark content
offsetY number 0 Vertical offset of the watermark content
width number 120 Width of the watermark content
height number 60 Height of the watermark content
opacity number 0.15 Opacity of the watermark
rotate number -24 Rotation degree of the watermark content
fontSize number 16 Font size of the text-watermark
fontWeight string | number 400 Font weight of the text-watermark
fontStyle 'normal' | 'italic' normal Font style of the text-watermark
fontVariant 'normal' | 'small-caps normal Font variant of the text-watermark
fontColor string #000 Font color of the text-watermark
fontFamily string sans-serif Font family of the text-watermark
textAlign CanvasTextAlign center Text alignment of the text-watermark
textBaseline CanvasTextBaseline alphabetic Text alignment of the text-watermark

License

MIT

Package Sidebar

Install

npm i @acrodata/watermark

Weekly Downloads

8

Version

1.2.0

License

MIT

Unpacked Size

119 kB

Total Files

16

Last publish

Collaborators

  • nzbin