Visualize the attractors of a dynamical system. Click to randomize parameters.
for(_='10ZZ*Y]:Xb,W++V=a.U=d.T0,S|SK=(Yq[p].;J=1/Q((B[--;)for(;i;i=1200]*K)K-=J;/Z<<2)tion[i]=);],=Z/4.2*,M[KV] .style.=b*(1-1*ImageData(0;4>i;iV)func==h?[=[ =N[var d=Math,eTsin,fTcos,gTrandom,p=SqrUwidth,tUheight,u=5*rv=5*twrxty=[-2,-2.9,2.7,2.4s=[.7,.5,.6,.4A=[128,Z9,113,Z7BCDEFGO=document,P=0;O.onclick=(){i=y2>i?-3,-1):1,3),s.3,.7),A64,128)|0}G[SYr)SYt)|0];c.fillRect(SSr,taposi="absolute"3JUcloneNode(),O.body.appendChild(J),qJ.getContext("2d"R( Wo){return g()*(o-b)+b} R(){J=p=Vp%33q[J=VJ%3].canvasopacity=1-.2*iBy+s*e(P/Ar-u)/wwYrDw*f2Ev+x*e1t-v)/xx;j=Yt;jC[j]=u+w*e0F[j]=x*f3L=creater,tM=L.data;var b=P%1E3/1E3;h=6*b|0;k=6*b-h;b=256;l=0*b;mkn(1-k)N=1m,WlX2l,WnX3l,m,bX4n,l,bX5Wl,mX[Wn,l]H=G[0I=G[1j=150;jJ=C[I]-D[HI=E[H]-F[IH=J,K=r*(I+(H0]1]2] +=64;putL,S0PV;requestAnimaFrame(R)};';G=/[-S-Z]/.exec(_);)with(_.split(G))_=join(shift());eval(_)
Zm9yKF89JzEwWloqWV06WGIsVysrVj1hLlU9ZC5UMCxTfFMfSz0oWR5xW3BdLh07Sj0xLxxRKBsoQlsaLS07KRlmb3IoGDtpGRc7GGk9FhYxMjAwFxVdKkspHxQUSy09SjsTL1o8PDIpEnRpb24RW2ldEBA9Dyk7Dl0sDD1aLzQuMioLLE1bS1ZdCS5zdHlsZS4IPWIqKDEtMSoHSW1hZ2VEYXRhKAYwOzQ+aTtpVikFZnVuYxEEPT1oP1sDPVsMAgk9TlsBdmFyIGQ9TWF0aCxlVHNpbixmVGNvcyxnVHJhbmRvbSxwPVNxAnJVd2lkdGgsdFVoZWlnaHQsdT01KnIfdj01KnQfdwtyH3gLdB95PVstMiwtMi45LDIuNywyLjQMcz1bLjcsLjUsLjYsLjQMQT1bMTI4LFo5LDExMyxaNwxCAkMCRAJFAkYCRwJPPWRvY3VtZW50LFA9MDtPLm9uY2xpY2s9BCgpexhpPQV5DzI+aT8bLTMsLTEpOhsxLDMpLHMPGy4zLC43KSxBDxs2NCwxMjgpfDB9FUcPWxtTWXIpHxtTWXQpfDBdO2MuZmlsbFJlY3QoU1NyLHQOYQhwb3NpET0iYWJzb2x1dGUiFjMXSlVjbG9uZU5vZGUoKSxPLmJvZHkuYXBwZW5kQ2hpbGQoSikscQ9KLmdldENvbnRleHQoIjJkIg5SKA4EIBtXbyl7cmV0dXJuIGcoKSooby1iKStifQQgUigpe0o9cD1WcCUzFjMXcVtKPVZKJTNdLmNhbnZhcwhvcGFjaXR5PTEtLjIqaRYFQg95ECtzECplKFAvQRAOHnItdSkvdxx3FllyF0QPdypmGjIURQ92K3gqZRoxEx50LXYpL3gceDsYaj1ZdDtqGUNbal09dSt3KmUaMBRGW2pdPXgqZhozE0w9HWNyZWF0ZQZyLHQOTT1MLmRhdGE7dmFyIGI9UCUxRTMvMUUzO2g9NipifDA7az02KmItaDtiPTI1NjtsPTAqYjttB2sObgcoMS1rKQ5OPTEDbSxXbFgyA2wsV25YMwNsLG0sYlg0A24sbCxiWDUDV2wsbVhbV24sbF0VGEg9RxBbMAxJPUcQWzEMaj0xNTA7ahlKPUNbSV0tRFtIDEk9RVtIXS1GW0kMSD1KLEs9ciooSRIrKEgSATBdATFdATJdCSs9NjQ7HXB1dAZMLFMwDlBWO3JlcXVlc3RBbmltYRFGcmFtZShSKX07JztHPS9bAS0fUy1aXS8uZXhlYyhfKTspd2l0aChfLnNwbGl0KEcpKV89am9pbihzaGlmdCgpKTtldmFsKF8p
//====================================================================
// ------------------------------------------------------------------
// Peter de Jong Attractor
// Copyleft 2017 by Dyno <dyno@aldabase.com>
// ------------------------------------------------------------------
// see http://paulbourke.net/fractals/peterdejong/
// see http://www.complexification.net/gallery/machines/peterdejong/
// ------------------------------------------------------------------
//====================================================================
// ==ClosureCompiler==
// http://closure-compiler.appspot.com/home
// @compilation_level ADVANCED_OPTIMIZATIONS
// @output_file_name index.min.js
// @output_format text
// @output_info compiled_code
// ==/ClosureCompiler==
//====================================================================
var {sin, cos, random:rnd} = Math,
hsv_hi, hsv_f, hsv_p, hsv_q, hsv_t,
num_canvas = 3,
current_canvas = 0,
context = [],
screen_width = a.width,
screen_height = a.height,
mult = 10,
mid_x = (screen_width * (mult / 2)) | 0,
mid_y = (screen_height * (mult / 2)) | 0,
quarter_x = (screen_width * (mult / 4.2)) | 0,
quarter_y = (screen_height * (mult / 4.2)) | 0,
num = 1200,
offset = [-2.0, -2.9, 2.7, 2.4],
amplitude = [ 0.7, 0.5, 0.6, 0.4],
period = [ 128, 109, 113, 107],
constant = [],
va = [],
vb = [],
vc = [],
vd = [],
position = [],
x,
y,
z,
index,
image,
imageData,
color,
newCanvas,
doc = document,
iteration = 0;
/*=====================================*/
/* Click handler: randomize parameters */
/*=====================================*/
doc.onclick = function() {
for (i = 0 ; i < 4 ; i++) {
offset[i] = (i < 2) ? random(-3, -1) : random(1, 3);
amplitude[i] = random(0.3, 0.7);
period[i] = random(64, 128) | 0;
}
console.log([offset,amplitude,period]);
}
/*===============*/
/* Run main demo */
/*===============*/
init();
anim();
/*===========================================*/
/* Return a random float between min and max */
/*===========================================*/
function random(min, max) {
return rnd() * (max - min) + min;
}
/*=======================================*/
/* Convert a Hue Saturation Value to RGB */
/*=======================================*/
function hsv2rgb(h, s, v) {
hsv_hi = (h * 6) | 0;
hsv_f = (h * 6) - hsv_hi;
v *= 256;
hsv_p = v * (1 - s);
hsv_q = v * (1 - hsv_f * s);
hsv_t = v * (1 - (1 - hsv_f) * s);
return (
(hsv_hi == 1)
? [hsv_q, v, hsv_p]
: ( (hsv_hi == 2)
? [hsv_p, v, hsv_t]
: ( (hsv_hi == 3)
? [hsv_p, hsv_q, v]
: ( (hsv_hi == 4)
? [hsv_t, hsv_p, v]
: ( (hsv_hi == 5)
? [v, hsv_p, hsv_q]
: [v, hsv_t, hsv_p]
)
)
)
)
);
}
/*=================*/
/* Initializations */
/*=================*/
function init() {
// Mrdoob's JavaScript Performance Monitor
addstats();
// Starting position
for (i = num ; i-- ; ) {
position[i] = [
random(0, screen_width * mult) | 0,
random(0, screen_height * mult) | 0
];
}
// Create multiple canvas
c.fillRect(0, 0, screen_width, screen_height);
a.style.position = 'absolute';
for (i = num_canvas ; i-- ; ) {
// Create new canvas
z = a.cloneNode();
// Append to DOM
doc.body.appendChild(z);
// Get context
context[i] = z.getContext('2d');
}
}
/*================*/
/* Main animation */
/*================*/
function anim() {
// Mrdoob's JavaScript Performance Monitor
updatestats();
// Swap visible canvas
current_canvas = ++current_canvas % num_canvas;
z = current_canvas;
for (i = num_canvas ; i-- ; ) {
context[z = ++z % num_canvas].canvas.style.opacity = 1 - i * 0.2;
}
// Set attractor constants
for (i = 0 ; i < 4 ; i++) {
constant[i] = offset[i] + amplitude[i] * sin(iteration / period[i]);
}
// Initialize LUTs
index = (screen_width * mult - mid_x) / quarter_x;
z = 1 / quarter_x;
for (i = screen_width * mult ; i-- ; ) {
vb[i] = (quarter_x * cos(constant[2] * index)) | 0;
vc[i] = mid_y + (quarter_y * sin(constant[1] * index)) | 0;
index -= z;
}
index = (screen_height * mult - mid_y) / quarter_y;
z = 1 / quarter_y;
for (j = screen_height * mult ; j-- ; ) {
va[j] = mid_x + (quarter_x * sin(constant[0] * index)) | 0;
vd[j] = (quarter_y * cos(constant[3] * index)) | 0;
index -= z;
}
// Create a new blank ImageData object
image = context[current_canvas].createImageData(screen_width, screen_height);
imageData = image.data;
// Draw Peter de Jong Attractor
color = hsv2rgb((iteration % 1000) / 1000, 1.0, 1.0);
for (i = num ; i-- ; ) {
x = position[i][0];
y = position[i][1];
for (j = num / 8 ; j-- ; ) {
z = va[y] - vb[x];
y = vc[x] - vd[y];
x = z;
index = (screen_width * ((y / mult) << 2)) + ((x / mult) << 2);
imageData[index++] = color[0];
imageData[index++] = color[1];
imageData[index++] = color[2];
imageData[index++] += 64;
}
}
// Copy to current canvas
context[current_canvas].putImageData(image, 0, 0);
// Next frame
iteration++;
requestAnimationFrame(anim);
}