What if you want to create a chart that no one has ever used and only you know its functionality ,only you know it looks and you don't know its name, it is completely a new dish which you want to make. In this case what will you do? You can consider using d3.
What is D3?
Data Driven Documents, if you want to make charts in your application that are using dynamic data then d3 is the right choice. D3 serves you a lots of chart options to visualise data, you can customise your charts, can remove or add any functionality from your chart. D3 provides more flexibility and control as it directly manipulates the DOM.
Why D3? Benefits of using d3
Currently D3 is famous and has large community of users as compared to other libraries.
D3 is more than a normal visualisation library, it can help to create animations, diagrams and many more as it works with html, css and svg.
-> D3 helps us to create customised charts, unlike many other available charts libraries where we just use the given code template to create chart, these can be easy to use but comes with lots of restrictions as we'll not be able to modify the charts according to our need, we are just left with their chart design, as a result chart look and experience will be too common whereas, d3 does not provides us such templates, it provides us helper functions, these helper functions works at basic level like DOM selection, creating axis. Moreover d3 provides us the flexibility to create our own helper functions.
In short, only we define each and every thing in our graph while using d3, which helps us to make more customised charts.
-> In other chart libraries, while using a specific type of chart, the structure of the input data is already defined, so we are restricted to provide same structure of input data, whereas in d3 we can customise it as well.
->D3 is open source, large number of chart options are available, many examples are also available, large community and users as compared to others.
-> D3 can be easily used with other JS based frameworks like react, angular.
Problems we can face while using d3:
-> If you are new to d3 then you might find the syntax a bit confusing, but we have a solution for that too.
Start by practicing the simplest chart or may be start by creating a simple square diagram using d3. Notice how d3 is manipulating DOM< how helper functions are working.
In next blog we'll try to understand working of d3 in simplest way.
Other chart frameworks are easy to use but as you know they come with lot of restrictions.
-> No doubt that d3 is compatible with JS based frameworks but sometimes you can face problems while using d3, just look if you are using the right version of d3 that is compatible with your JS framework.
Let me know your thoughts about d3 in comments and what library do you use for making charts in your applications?
Top comments (0)