Today we will learn How to Create Interactive Charts using D3.js. In order to make our learning close to real life problem we will use the data provided by Nasa and use that to create our Interactive Charts. We will be using GISS Surface Temperature Analysis data provided by National Aeronautics and Space Administration. You can find more details at http://data.giss.nasa.gov/gistemp.

Welcome to the How to create reusable charts with React and D3 Part3, this would be the final part of our series. We will first focus on adding the Donut Chart, then Stacked Bar Chart. Afterwards we will make the range filter (date range) to reload data. This last part should be simple and easier to follow along.

In this How to create reusable charts with React and D3 Part2 we will create Area and Line charts using multiple reusable React Components. We will use the knowledge we gained from our previous article here.

In this series we will continue working on our D3 components that we have created in our past lesson and make them fully reusable, extensible and maintainable. This How to create reusable charts with React and D3 Part1 would cover the basics and then we will dive into more complex scenarios.

In this How to Create Stacked Bar Chart using d3.js post we will learn not only to code but the mathematical calculation behind creating a stacked bar chart using d3. Even if you have probably copy pasted a working version the code, I strongly recommend you to go though this tutorial in order to get a solid understanding on how this works.