D3.js is a JavaScript library for manipulating documents based on data. D3 helps you bring data to life using HTML, SVG, and CSS. It is a powerful library for data visualization in programming.
Today I just want to share with you what I have learned from using D3.js.
Firstly use the lasted D3 because you are going to run into some problems if you use the old versions. As for now, the latest version is this one https://unpkg.com/d3@5.6.0/dist/d3.min.js.
If you are a beginner I recommend you follow this youtube tutorial https://youtu.be/_8V5o2UHG0E This man is good at explaining the fundamentals of d3. If you want to dive deep there are a lot of examples on https://vizhub.com/. Since there are a lot of examples on the internet all you need to know is how to manipulate give graphs to need your requirements. I also recommend d3 documentation, there are a lot of examples too that you can learn from.
I was having trouble with running my code because of the CORS policy which does not allow us to load data stored locally. My solution was to store my CSV files on GitHub. if you are facing the same challenge I advise you do the same.
I am not a vanilla javascript ned, so connecting components and how to run functions is really a problem . if you are like me I recommend using react or vue.js and take advantage of life cycle hooks.
Happy coding, you can check out the code of the video above on my GitHub