fireworks-js
Описание
🎆 A simple fireworks library! Ready to use components available for React, Vue 3, Svelte, Angular, Preact, Solid, and Web Components.
Языки
- TypeScript84,7%
- CSS5%
- Svelte4,1%
- Vue2,8%
- HTML2,7%
- JavaScript0,7%
A simple fireworks library! | fireworks.js.org
Table of Contents
Warning
This readme refers to upcoming v2 version, read here for v1 documentation.
Features
- 🔥 Zero dependencies
- ⚙️ Flexible configuration
- 📦 Lightweight (~3.0kB gzipped)
- 📜 Supports TypeScript type definition
Browsers support
 Edge |  Firefox |  Chrome |  Safari |  iOS Safari |  Opera |  Yandex |
|---|---|---|---|---|---|---|
| ✔ | ✔ | ✔ | ✔ | ✔ | ✔ | ✔ |
Demo
You can play with
Installation
| Package | Status | Description |
|---|---|---|
| fireworks-js |  | Vanilla JS |
| @fireworks-js/react |  | React component |
| @fireworks-js/preact |  | Preact component |
| @fireworks-js/solid |  | Solid component |
| @fireworks-js/vue |  | Vue 3 component |
| @fireworks-js/svelte |  | Svelte component |
| @fireworks-js/angular |  | Angular component |
| @fireworks-js/web |  | Web components |
CDN
Usage
fireworks-js
@fireworks-js/react
@fireworks-js/preact
@fireworks-js/solid
@fireworks-js/vue
@fireworks-js/svelte
@fireworks-js/angular
@fireworks-js/web
Documentation
Options
Note
The options is optional, as are each of its properties.
| Property | Type | Default |
|---|---|---|
| object | hue |
| object | rocketsPoint |
| object | mouse |
| object | boundaries |
| object | sound |
| object | delay |
| object | brightness |
| object | decay |
| object | lineWidth |
| string | round |
| number | 5 |
| number | 0.5 |
| number | 1.05 |
| number | 0.95 |
| number | 1.5 |
| number | 50 |
| number | 3 |
| number | 50 |
| number | 30 |
| number | 10 |
| number | 30 |
| boolean | true |
The
| Property | Type |
|---|---|
| number |
| number |
Note
Theandminproperties are used to randomly select values from the range.max
The
| Property | Type | Default |
|---|---|---|
| boolean | false |
| boolean | false |
| number | 1 |
Note
Theproperty has no effect ifmaxis false.click
The
API
.start()
Start fireworks.
.launch(count)
Launching a specified number of fireworks.
Type:
Default
.stop(dispose)
Stop fireworks.
Type:
Default:
.waitStop(dispose)
Asynchronous stopping of the fireworks.
Type:
Default:
.pause()
Start/stop fireworks.
.clear()
Cleaning the canvas from fireworks.
.currentOptions
Getting current fireworks options.
.updateOptions(options)
Force update fireworks options.
Type:
.updateSize(sizes)
Force update canvas size.
Type:
.updateBoundaries(boundaries)
Force update canvas boundaries.
Type: