In the last article we created a simple little hard coded graph with RaphaÃ«l. I also insulted the Germans. That wasnâ€™tÂ entirelyÂ fair because RaphaÃ«l is really an Italian name and we never thrashed them in a war, probably because they were too busy being defeated by the French. The French. Oh, and we did thrash the Italians too. Thatâ€™s why you come to this blog: friendly racism, code and an inability to forget wars which happened 40 years before the author was born. Â So weâ€™reâ€™ still going to call the library Ralph.
Iâ€™m going to dive right in and rewrite this puppy as a component in TypeScript
Another great feature in the component is the use of ES5 style loops on line 29. This is basically an iterator syntax.
The final thing to which I wanted to draw your attention was the lambda style anonymous functions. You can see this inside the same loop on line 29. Iâ€™ve always found this syntax cleaner than a full function. The => is sort of the official syntax now for lambda functions with C# and Java both adopting it.
To make use of our new graph component is easy. We just call
I find the TypeScript to be way more readable.
In the next part weâ€™re going to look at an alternative library which might be better suited for creating data visualizations.