Can we live without pies?
Posted on January 13, 2018 in
2 min read
Cakes are delicious, thus, no! We cannot live without pies.
In this further iteration of my D3.js reusable templates journey, here another module that allows generating a pie/donut chart type with D3.js.
To learn more about some of the core principles, please refer to my previous article.
As in the previous module, the bootstrap relies to the D3.js data binding mechanism. A pie can become a donut by a metter of a config:
By using some accessors it is possible to instruct the generator about how to use the given dataset without restructuring it as well as using custom function to tint elements:
This module can receive data updates therefore the chart update accordingly (push the 'update' button):
Beyond the Pie
The radius configuration can accept functions, thus, it opens up several way to build representation based on the pie/donut model:
The spirit of the whole project is to make easy further customizations using D3.js instead baking all the possibile user requirements within it:
This is another major principle of the project: allowing easy interoperability between components such as this little initial example.
Click on each slice to see the result of this demo:
Nothing stop to use this module as a tiny UI element such as a little gauge:
Still happy of the results nevertheless some changes over the road.
Let's see the next episode!