Data Visualization and D3.js Newsletter Issue 37 Weekly Data Visualization and D3.js Newsletter

Hi Friends -

Welcome to the thirty-seventh issue of's Weekly Newsletter

Onwards to this week's links...


  • How To Turn Everyone In Your Newsroom Into A Graphics Editor
    Today Quartz is open-sourcing the code behind Chartbuilder, the application we use to make most of our charts. Along with the underlying charting library — called Gneisschart — the tool has given everyone in our worldwide newsroom 24-hour access to simple charts at graphics-desk quality. It has helped all of our reporters and editors become more responsible for their own content and less dependent on others with specialized graphics skills.
  • Colony
    Colony is a neat little visualization tool for exploring Node projects and their dependencies using d3.js. Each file is represented as a node in the graph. If one file depends on another, a link is made between the two files. Each file is colored based on the module they belong to. By hovering over a node, you can see the file's name, the files it depends on (light), and the files that depend on it (dark).

Data Visualization Reading and Videos

  • Becoming a Data Scientist – Curriculum via Metromap
    Given how critical visualization is for data science, ironically I was not able to find (except for a few), pragmatic and yet visual representation of what it takes to become a data scientist. So here is my modest attempt at creating a curriculum, a learning plan that one can use in this becoming a data scientist journey. I organized the overall plan progressively into the following areas / domains, 1) Fundamentals 2) Statistics 3) Programming 4) Machine Learning 5) Text Mining / Natural Language Processing 6) Data Visualization 7) Big Data Data 8) Ingestion 9) Data Munging 10) Toolbox ...
  • Launches Tool For Creating Colorful Charts On Excel Charts for Excel features 30 different chart types and various designs. Charts can be easily published online, shared on social networks, embedded in a news article or a blog post. All the data is automatically synchronized and stored in the cloud. Even if you don’t save your spreadsheet you can bring your data back any time as they are placed in your library.
  • Drawing With Sounds, An Interactive Musical Drawing App Created with Processing
    This is my first creation using the Drawing with Sounds application. This cause and effect application was created with Processing 1.5.1 and produces musical sounds and patterns, along with random abstract shapes that are triggered through movements of a mouse. The application has been adapted for switch users, making it accessible to those who have motor impairments.
  • Prism - Your SMS History, Visualized
    Prism creates dynamic, customizable visualizations of your texting history based off of the data in your iTunes backups. You can sort, color, blend, and mix your texting history in a variety of ways to create aesthetically pleasing - and often times surprising - personalized infographics. The data is You!
  • Reddit Insight
    We downloaded the Reddit - What we found will surprise you. Real-Time Post Tracking. Track a Single User. Word Clouds. View Interaction. Data Nuggets. Visualizations.

D3.js Reading and Videos

  • rCharts + Dimple.js
    There are plans in rCharts future to provide support for partial layouts similar to slidify. For now though, there are some other options to adding script/html to customize your chart. A good reference example comes from dimplejs new interactive legends example. In this case a small bit of javascript is added to the base chart to hide/show scatter points when the corresponding legend item is clicked.
  • Choropleth in D3.js and Pandas (iPython Notebook)
    A lot of people have done a mash-up of D3 with iPython Notebook. Some efforts created a floating overlay over the Notebook rather than creating the output in the standard Notebook inline format. More recent efforts have utilized the Notebook's publish_html() to generate the output inline. One of the more advanced such efforts, ipyD3, however, works only on Windows. I've forked his gist and modified the couple of lines to make it Mac compatible.
  • More Data Visualization Libraries Based on D3.js
    There are a lot of ways to visualize data on the Web (with more emerging every day), but the flexibility, versatility, and energized development community surrounding D3.js makes it a great option to explore. This list is part two of what will assuredly be a continuing series.
  • Cal-Heatmap
    Cal-Heatmap is a JavaScript module to create a calendar heatmap. Uses D3.js.
  • Visualizing A Newborn's Feeding And Diaper Activity
    Days progress from left to right, hours of the day from top to bottom. For feedings, circle size indicates amount imbibed. Data collected by my wife and myself. Visualized using d3.js. Feedback and questions below.

Hope that you had a great past week and that next week is even better!

Wishing you the best, 
Sebastian Gutierrez

Want to better understand this topic?
Check out these super-useful D3.js Screencast Videos (1 in 3 are free...)
=> D3 Screencasts Videos