In this simple tutorial, I want to show you how to make a hand-drawn pie chart using the Rough.js and D3.js libs. Besides, you can use Rough.js to draw other geometric figures, maps (using D3.js) in sketch style.
Creating a new project
Let’s create an empty folder using the following command:
To run this project you need to run a simple http-server inside the project folder. In this case, I used Python. Just run the next command in project folder:
Now open your browser on localhost:8000. You will see our hand-drawn pie chart:
With Rough.js you can show data on your page with a sketchy style. You can use Pie Charts for statistics, analytics and in a wide range of business and social projects. All code related to this tutorial you can find here.
If you interested in other tutorials using Rough.js, D3.js, building charts, please type your idea in comments and I will help you.
If you liked this, please help spread the word by hitting the recommend button below. Thanks!