https://github.com/indus/zodiac

rewrite of jnicol/particleground
https://github.com/indus/zodiac

Last synced: about 1 month ago
JSON representation

rewrite of jnicol/particleground

• Host: GitHub
• URL: https://github.com/indus/zodiac
• Owner: indus
• License: mit
• Created: 2015-04-02T08:28:13.000Z (about 10 years ago)
• Default Branch: master
• Last Pushed: 2016-12-11T19:11:29.000Z (over 8 years ago)
• Last Synced: 2025-03-27T11:38:09.812Z (about 2 months ago)
• Language: TypeScript
• Size: 275 KB
• Stars: 101
• Watchers: 2
• Forks: 7
• Open Issues: 4
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
[![JS.ORG](https://img.shields.io/badge/js.org-zodiac-ffb400.svg?style=flat-square)](http://js.org)

particle background inspired by [jnicol/particleground](https://github.com/jnicol/particleground)

**Demo** [zodiac.js.org](http://zodiac.js.org/)

``` js

new Zodiac('zodiac',                      // HTMLCanvasElement or id

   {                                      //// OPTIONS

      directionX: 0,                      // -1:left;0:random;1:right

      directionY: -1,                     // -1:up;0:random;1:down

      velocityX: [.1, .2],                // [minX,maxX]

      velocityY: [.5, 1],                 // [minY,maxY]

      bounceX: true,                      // bounce at left and right edge

      bounceY: false,                     // bounce at top and bottom edge

      parallax: .5,                       // float [0-1...]; 0: no paralax

      pivot: 0,                           // float [0-1...]; pivot level for parallax;

      density: 10000,                     // px^2 per node

      dotRadius: [2, 5],                  // px value or [minR,maxR]

      backgroundColor: 'rgb(9,9,9)',      // default transparent; use alpha value for motion blur and ghosting

      dotColor: 'rgba(99,99,99,.3)',

      linkColor: 'rgb(99,99,99)',

      linkDistance: 50,

      linkWidth: 2

   });

```