@cycjimmy/canvas-snow v3.0.3

Canvas Snow

• Generates snow in canvas. (Demo)

Install

# via npm
$ npm install @cycjimmy/canvas-snow --save

# or via yarn
$ yarn add @cycjimmy/canvas-snow

Usage

import CanvasSnow from '@cycjimmy/canvas-snow';

const canvasSnow = new CanvasSnow({
  ...options
}).init();
canvasSnow.start();

• options

  • context: Element|String Context Wrapper Element.
  • cell: Number The maximum number of snow in the canvas.
  • width: Number|String Set canvas width with percentage and px units. Default '100%'.
  • height: Number|String Set canvas height with percentage and px units. Default '100%'.

• Methods:

  • init(): Initialize to generate random snow.
  • start(): Start snow animation.
  • stop(): Stop snow animation.
  • clear(): Clear Generated random snow.

Use in browser

<div id="snowWrapper"></div>
<script src="canvas-snow.umd.min.js"></script>
<script>
  const canvasSnow = new CanvasSnow(source, {
    context: '#snowWrapper',
    [...options]
  }).init();

  canvasSnow.start();
</script>

CDN

To use via a CDN include this in your HTML:

<script src="https://cdn.jsdelivr.net/npm/@cycjimmy/canvas-snow@3/dist/canvas-snow.umd.min.js"></script>