In this post, we will not be discussing too heavily on D3, but specifically it’s applications and techniques.
Understanding D3’s concepts
There are 3 important concepts in understanding how D3 is used. How wide your data set is called the Domain – example: 1 – 100 would set the array size from the lowest, 1 to highest 100. Range allows the data to be transformed into the corresponding pixels on screen. To convert data into corresponding values, Scales are used such as Quantitative (Numerical) and Ordinal Scales (alphabetical).
Example of D3 Charts & Graphs
From bar graphs to interactive charts, D3 allows big data to be presented in it’s most concise and creative form. Here are some commonly used examples of D3.
b) Stacked Bars
d) Symbol Map
f) Heat Maps
g) Galaxy Chart
How & When Should You Apply D3?
A good way to judge is to understand the background of your client’s needs. For example if you are working with an Energy company, data visualisation can be helpful to show stats on how energy is being consumed, or for a Non-profit Organisation, maps can be helpful in representing the population.
Many websites with D3 often place data visualisation at the main header section – which creates a beautiful and sophisticated-style backdrop, here is an example from BrandLoveScore:
Guardian’s Bussed Out is an example on how maps are used and interactively animated when the user scrolls down the page:
When embarking on a data visualisation project, give careful thought to meaningful interactions that engages the user. Data should also be represented clearly and not appear too overbearing.
Bringing data to life is one of the best ways to communicate information to users and enhances user experience. Always consider using data visualisation as it is one of the best ways to increase user engagement for a brand, company or cause.