One in a series of experiments on using D3 to generate a SVG and then the Greensock library to animate the SVG elements.
Inspired by this excellent Numberphile video on Moiré optical illusions, I built this example to showcase this optical illusion.
Notice when you rotate one of the layers slightly you get the illusion that there is a circular hole of sorts. Rotate too much and the effect is lost.
When you move the layer in the leftwards direction, the circular hole moves up. If you move the layer upwards, the circular hole appears to move right. Professor Tadashi Tokieda explains why in the excellent video.
Layers are colored red and blue to more easily distinguish between the two layers.
For the whole series of experiments you can check out: A Study in Moiré Patterns
There is a UI interface there for people to manipulate the layers on this particular example.