Skip to content

Instantly share code, notes, and snippets.

View Chi-Loong's full-sized avatar

Chi-Loong Chi-Loong

View GitHub Profile
@Chi-Loong
Chi-Loong / README.md
Last active March 17, 2021 07:45
D3 bar chart part II

Extension of D3 bar chart for teaching and explanation purposes.

Follow's D3 design pattern of enter, update and exit loop with simple transition to show how this can be done easily. Updated to D3 v6, using the selection.join syntax.

Part 2 of a series.

Part 1 here

@Chi-Loong
Chi-Loong / README.md
Last active March 17, 2021 05:39
D3 bar chart part I

A really simple stripped down D3 bar chart for teaching and explanation purposes.

To go over design patterns like margin design and styling using CSS.

Part 1 of a series. Part 2 is about transitions and using a enter, update and exit loop. Updated to d3 v6.

Part 2 here

@Chi-Loong
Chi-Loong / README.md
Last active December 7, 2016 16:50
Optical Illusions with dots

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.

@Chi-Loong
Chi-Loong / README.md
Last active February 2, 2017 08:17
Moiré Spikes

One in a series of experiments on using D3 to generate a SVG and then the Greensock library to animate the SVG elements.

The idea was to test out how Moiré patterns are generated using various types of shapes.

For the whole series of experiments you can check out: A Study in Moiré Patterns

@Chi-Loong
Chi-Loong / README.md
Last active December 7, 2016 16:04
Moiré Circles

One in a series of experiments on using D3 to generate a SVG and then the Greensock library to animate the SVG elements.

The idea was to test out how Moiré patterns are generated using various types of shapes.

For the whole series of experiments you can check out: A Study in Moiré Patterns