Fireworks.js

Demo Controls

Why explain through reading when you can demonstrate by example? Try playing around with the sliders below for a wide range of visual effects. Not all combinations will look good, but the idea is to experiment.

Drag the sliders (or click a point on the bar) to set the various parameters available such as blast radius and the number of particles per explosion, then click "fire" to see the results.

The code required to generate the current effect is dynamically updated as you adjust the controls; refer to the createFirework() API call below.

Fireworks Parameters

Apply
Apply
Blast Radius
% of window size
1-100
Particles
Explosion elements
1-200
Circles
..per explosion
1-8
Burst Type
(Base colour)
1-7
Start X
% of window
1-100
Start Y
% of window
1-100
Explode X
% of window
1-100
Explode Y
% of window
1-100

Additional Options

Randomize explosion pattern
Obey window boundaries

Hide content (may increase performance)

API call for current parameters

createFirework(nRadius,nParticles,nCircles,burstType,startX,startY,burstX,burstY));

Note: Random values will be substituted for null arguments and options that are not applied.

Demo Presets

Don't want to play with sliders? Here are a few canned effects that I thought were neat. Refer to the code for the parameters used to make the effect.

Features

Fireworks does the following nifty things: