D3 (Data-Driven Documents) is a JavaScript library (think JQuery!) that relies on manipulation of DOM elements and SVG to render dynamic graphs and charts.
Why did you choose this subject? I used Chart.JS in a previous project because I felt that D3 was too complex for the basic data visualization I wnated to do. Now that I've completed most of the WDI course, I felt like I was in a better position to try it again and understand it.
How were you first made aware of it? Through research on different data visualization libraries. It's one of the most well known.
What problem does it solve? It provides a library to allow for complex graphic and data visualization. It's similar to JQuery in that it's a library that manipulates DOM elements - you don't need to learn a different language to execute this. You just need to know D3 syntax, JQuery and JavaScript.
How does it solve the problem (conceptually)? It appends elements to a pre-defined SVC "canvas". It then appends properties to these elements that contain the characteristics of the data-set (data values, position on the canvas, etc.)
Why does one use it? To display data, graphs, charts in a visually informative and appealing way.
What are the alternatives? Chart.JS (open source JavaScript library as well),
What is it similar to, if anything? AnyChart Datacopia gnuplot Matlab Matplotlib Plotly Processing Qlik R Raphaël SAS Tableau Software Zoomdata
What is the history of this technology? D3 was based off of a "visualization toolkit" developed in 2005 that used Java to render data visualizations in the browser.
3 individuals at Stanford University's Visualization Group used this idea to created a JavaScript library based off of previous toolkits. In 2011, using multiple iterations of this library and other visualization toolkits, D3 was developed as a framework based on JavaScript.
Who built it and why? Pressofr Jeff Heer, Mike Bostock and Vadim Ogievetsky - all affiliated with Stanford University's Visualization Group. They had previously worked on Prefuse and Flare (visualization tools to render data in the browser using Java and associated plug-ins)
Who is maintaining it? I think that Berkely is? I couldn't find a definitive answer on this
What is your opinion on the technology after having built something with it? A bit of a lift to understand the basic flow, but once you can follow the documentation, it's great. I can understand this a lot better after having more exposure to JavaScript.
What are the biggest conceptual hurdles (if any) you encountered when researching this? I think the syntax and knowing about all of the functionality that is available to you is the biggest hurdle. What helped me the most was looking at others finished products and their code to understand how they executed it.
What resources do you recommend for interested students? These 3 Accio Youtube videos walk you through the basics. You can clone their repo as well so you have all their code: https://www.youtube.com/watch?v=K3FMuLT_3Ik https://www.youtube.com/watch?v=8imtXLY0F9g https://www.youtube.com/watch?v=4sgzOzPo_Dc&t=130s
What article or forum was most helpful to you in learning this?
- https://bl.ocks.org/mbostock - this has a gallery of D3 projects and their code bases
- These Accio Code tutorials above.
What are 3 interview questions one might be asked about this technology?
- How does D3 differ from other Javascript frameworks or languages?
- What are the benefits of using D3 over a software like Tableau?
- Do you foresee any challenges integrating D3 with other JavaScript frameworks?