Fast hight quality backround generation. No data, just js, save your network bandwidth !
(those are preview see the live demos below)
generated images are random, refresh the demo page to see more !
new BG(w, h)
w : width
h : height
seed(s)
s : the chosen seed number
fill()
noiseFast(vr, vg, vb, va, µr, µv, µb, µa, blim)
vx
: standard deviation of the x
color component
µx
: mean of the x
color component
blim : true to forbide color overflow (limit the components to 0-255)
erosion(levels)
levels : array of color variation for each level [[red1, green1, blue1, alpha1], [red2, green2, blue2, alpha2], ... ] each level double the canvas size, so init BG with a small size, typically : new BG(2, 2) Note : the image result can be looped, there will be no visible borders if you find the looped background too repetitive, init BG with a slightly larger size and use fewer erosion levels
radial(x1, y1, r1, x2, y2, r2, arg)
arg : specify a color stop list instead of using .addColorStop from native API example [[0, 'red'], [1, 'green']]
linear(x1, y1, x2, y2, arg)
arg : same as radial gradient
angular(x0, y0, rmin, r, arg)
arg : /!\ same as linear and radial but color are int instead of string example [[0, 0xffff0000], [1, 0xff00ff00]] /* hexadecimal 0xAARRGGBB */
spiral(x0, y0, rmin, rmax, dr, dteta, levels, right, out, fast)
x0 : x center coordinate
y0 : y center coordinate
rmin : starting raduis from the center (0 for a full disk)
rmax : ending raduis from the center
dr : mix with the pixel at dr distance from the center (typically 1)
dteta : and dteta form the side (typically between -2 and 2)
levels : an array of color noise defined by their variances [vr,vg,vb,va]
right : direction of spiral rotation
out : direction of filling (true : from the center to the outside, false otherwise)
fast : true or false, may affect the spiral shape quality
background(el)
el : DOM element
fit(el)
el : DOM element
hack()
return {
g: the drawing context,
im: the uint8Array of the pixels components,
u: the uint32Array of the pixels
}
Ask me !