Research Topic 2: Data Visualization

Data visualization is a big part of Project 2. Without a proper way to display data, the data will be just rows and columns in the table. So let’s do some research regarding data visualization on the web.

There are much available free data visualization JavaScript libraries.

D3.js

D3.js is one of the popular data visualization libraries with proper documentation. And it helps you bring data to life using HTML, SVG, and CSS. It is straightforward to choose a DOM element and apply the style to it inside D3. 

Like this “d3.selectAll(“p”).style(“color”, “blue”);” 

But I find an article said that there is a little drawback when using D3 with React Framework. Some functions of D3 may get wrong in React environment. So we need to be careful in that situation.

Victory

A set of modular charting components explicitly designed to React and React Native. Unlike D3, Victory specializes in React and React Native environment. It provides various type of chart for visualizing data. Easy to build nice-looking and dynamic charts.

Chart.js

Another popular open-source JavaScript library in Github. It has an advantage which supports a responsive web layout. In other words, developers don’t need to use extra effort to make it fit different screen size devices.

Conclusion

Every data visualization library has its advantages and disadvantages. We should choose the one that matches our requirement and the one that easy to begin.

Reference

1. https://www.monterail.com/blog/javascript-libraries-data-visualization?utm_campaign=dataviz&utm_medium=social&utm_source=quora

2. https://www.quora.com/Is-D3-js-the-best-framework-to-start-if-I-want-to-do-serious-data-visualization-via-the-browser-Is-it-easy-to-integrate-with-Python-or-R