A Retina-ready version of the deJong Attractor(jashkenas.s3.amazonaws.com)
jashkenas.s3.amazonaws.com
A Retina-ready version of the deJong Attractor
http://jashkenas.s3.amazonaws.com/misc/deJong/deJong.html
6 comments
Could someone explain what an attractor is? I looked it up on Wikipedia, but I don't understand how these shapes benefit from the definition given there.
The Wikipedia explanation is a fine one. To simplify -- it's when you observe a variable moving through through a space. In programming this means taking a coordinate or set of coordinates, and repeatedly feeding it into a function that will move the coordinates to a new location.
In this case, the heart of the function is:
(http://jashkenas.s3.amazonaws.com/misc/deJong/docs/deJong.ht...)
In our attractor, every time the coordinate pair lands on a new spot, that spot is exposed to a little bit of light.
What you can do for "x" and "y", you can also do for "z". If you generalize the deJong attractor into 3 dimensions, it looks like this:
https://www.youtube.com/watch?v=PrXe4RwtZpQ
In this case, the heart of the function is:
x = ((sin(xSeed * y) - cos(ySeed * x)) * width * 0.2) + width / 2
(http://jashkenas.s3.amazonaws.com/misc/deJong/docs/deJong.ht...)
In our attractor, every time the coordinate pair lands on a new spot, that spot is exposed to a little bit of light.
What you can do for "x" and "y", you can also do for "z". If you generalize the deJong attractor into 3 dimensions, it looks like this:
https://www.youtube.com/watch?v=PrXe4RwtZpQ
Could you explain why is it significant that points seem to cluster around some specific trajectories / coordinates?
This equation is an "attractor" because the coordinates remain close to particular points (in this case, the origin).
Not all iterated functions behave this way -- sometimes the coordinates will wander off, and that would be called a "repellor" (http://en.wikipedia.org/wiki/Repellor).
"sin" and "cos" are good primitives for building attractor functions, because they naturally stay bounded close to the origin -- "x²" for example, wouldn't work nearly as well.
As to why the deJong attractor draws particular trajectories ... that's the beauty and mystery of the thing. It's also interesting how it tends to draw particular types of shapes when seeded from different areas -- dusty spheres when seeded close to the origin, skinny loops in the 4th quadrant, folded sheets of cloth in the 1st and 3rd, and stacked diamond circles when seeded in the 2nd.
Not all iterated functions behave this way -- sometimes the coordinates will wander off, and that would be called a "repellor" (http://en.wikipedia.org/wiki/Repellor).
"sin" and "cos" are good primitives for building attractor functions, because they naturally stay bounded close to the origin -- "x²" for example, wouldn't work nearly as well.
As to why the deJong attractor draws particular trajectories ... that's the beauty and mystery of the thing. It's also interesting how it tends to draw particular types of shapes when seeded from different areas -- dusty spheres when seeded close to the origin, skinny loops in the 4th quadrant, folded sheets of cloth in the 1st and 3rd, and stacked diamond circles when seeded in the 2nd.
Actually, the attractor in a dynamic system is the equivalent of an asymptote in a standard function.
Since the points cluster around it, it is revealed by plotting the values of the system.
Since the points cluster around it, it is revealed by plotting the values of the system.
It would be interesting to read the proof that de Jong's function has an attractor. Do you know where I could find it?
So an attractor is the image of a recursively defined function?
The attractor is technically the set of points that the iterated value traces.
In this case, the image is produced by iterating the "x" and "y" values, and slightly exposing with a white light every "(x,y)" position they stop at. The more they stop at a particular pixel, the brighter that pixel becomes.
In this case, the image is produced by iterating the "x" and "y" values, and slightly exposing with a white light every "(x,y)" position they stop at. The more they stop at a particular pixel, the brighter that pixel becomes.
This is a repost (the Retina bit is new), but for those who haven't seen it before, you can share particular initial seeds by clicking on the "Permalink" button.
An example Retina seed: http://jashkenas.s3.amazonaws.com/misc/deJong/deJong.html#52...
Annotated source here: http://jashkenas.s3.amazonaws.com/misc/deJong/docs/deJong.ht...
One interesting question will be if anyone finds a single seed that works well for both regular and Retina versions.
An example Retina seed: http://jashkenas.s3.amazonaws.com/misc/deJong/deJong.html#52...
Annotated source here: http://jashkenas.s3.amazonaws.com/misc/deJong/docs/deJong.ht...
One interesting question will be if anyone finds a single seed that works well for both regular and Retina versions.
The best thing about this toy is that, no matter where you click, you get a beautiful result.
The only thing missing is arrowkey controls to bump around a pixel at a time, so you can better explore an interesting region of the space you've found.
The only thing missing is arrowkey controls to bump around a pixel at a time, so you can better explore an interesting region of the space you've found.
I noticed that dragging around causes the graph to change. I know I should just look at the source, but can someone tell me what inputs the dragging changes for the computation? Also, bonus points for some cool drags I can do that you notice.
This is the bit that records the dragging change in mouse position:
http://jashkenas.s3.amazonaws.com/misc/deJong/docs/deJong.ht...
This is the bit that seeds the sketch at the last recorded mouse position:
http://jashkenas.s3.amazonaws.com/misc/deJong/docs/deJong.ht...
http://jashkenas.s3.amazonaws.com/misc/deJong/docs/deJong.ht...
This is the bit that seeds the sketch at the last recorded mouse position:
http://jashkenas.s3.amazonaws.com/misc/deJong/docs/deJong.ht...
FWIW, in Firefox (15) I just see a white square. Works fine in Chrome.
what is this?!