One of the first things I did was to look for any tutorial videos on YouTube, and did I find a treasure trove of d3.js video tutorials! User d3Vienno has around 20 tutorials, many of them in the 10-minute duration, and very easy to follow. (The only thing unusual in the d3Vienno's videos is the narrator's pronunciation of the vowel sound in DOM (Document Object Model) with a \ü\, rather than with a \ä\).
|Click on the image to open the HTML source in the browser.|
And, an excellent selection of non-video tutorials, particularly the one on Three Little Circles, increased my desire to do a programming exercise of my own.
After I viewed the tutorials, the programmer instinct in me took over and, as I looked around to find a simple visualization problem to program, I recalled the Dining Philosophers problem that is used as a pedagogical tool to discuss concurrency in operating systems.
Of course, the purpose in my solving this problem was merely to see how the table, and the 5 chairs around it, can be programmed using d3.js as the tool. The resulting output is given in the diagram.