Data Visualization and D3.js Newsletter Issue 166

DashingD3js.com Weekly Data Visualization and D3.js Newsletter

Hi Friends -


Welcome to issue 166 of the DashingD3js.com Weekly Newsletter.
 

Onwards to this week's links...
 

Featured
 

  • Automatically Generate Beautiful Visualizations From Your Data And Other Bad Ideas
    I’m never surprised when I meet someone who is starting a startup to “make data visualization easy” or some combination of the words “one-click”, “magic”, “anyone can do it” and “data viz(sic)”. When an idea is obvious to everyone, including non-experts, it’s a pretty big warning sign that it’s not a good one...I want to take a deeper look at why this pursuit of automation is misguided, and in the process hope to point out potentially more fruitful paths...
  • Teaching A Semester Of D3.js
    I spent last semester frantically putting together a course on D3.js for journalism students at the University of Miami at the same time as teaching it and grading it...The class was meant to be a portfolio-builder, focused on journalistic interactive visualization...This post is a recap of what we did and what was hard about it. Next post (in a week) will show some of my students' work...
 

Data Visualization Reading and Videos
 

  • Create Your Own Grid Map, A Semi-Automatic Way
    In the past year, Grid Map is a visualization that gains a lot of popularity in the US...In Grid Map, each region is represented as a tile of the same shape and equal size...It has a few nice properties, which inspired me to create one for Thailand...The rest of this article will explain about Grid Map and how I created the Thailand map above...
  • Mapshaper - Tools For Editing Shapefile, GeoJSON And TopoJSON Files
    Mapshaper is software for editing Shapefile, GeoJSON, TopoJSON and several other data formats, written in JavaScript...The mapshaper command line program supports common map making tasks like simplifying shapes, editing attribute data, clipping, erasing, dissolving, filtering and more...There is a web UI that supports interactive simplification and attribute editing. The web interface also has as a built in console for running cli commands...
  • How You Will Die
    I returned to the Underlying Cause of Death database maintained by the Centers for Disease Control and Prevention. It provides data for the number of people who died in the United States between 1999 and 2014. The records are based on death certificates, which require an entry for a single cause of death...Enter your sex, race, and age...By the end, you're left with the chances that you will die of each cause...
  • Mothers' Education Level For New Babies In Singapore
    New babies are the future of every society. A study with more than 20000 children involved shows that "higher levels of maternal education predicted children's higher initial achievement at kindergarten and growth in achievement through eighth grade"...as a multiracial society, different ethnic groups in Singapore have different distributions...The chart below shows how maternal education varies across age and race, based on live births data from 2005 to 2014 in Singapore. Select a group to see the changes. Select educations to see them individually...
  • Axis Labels, Data Labels, Or Both? Four Line Graph Styles To Consider
    Data visualization is more about strategic thinking than about following steadfast rules...Take a simple line graph, for example...How will you label your line graph?...With vertical axis labels and light gray grid lines? With labels directly above or on top of the data points? A mix of both?...Here are four styles to consider...
 

D3.js Reading and Videos
 

  • Better Color Palettes with Histogram Equalization in D3.js
    As a data visualization engineer, I’m always learning new tricks to makes sense of data. Visualizing data on maps can be challenging. Some colleagues smarter than myself asked me if we could have a color palette using histogram equalization. So I went to Wikipedia: “Histogram equalization is a method in image processing of contrast adjustment using the image’s histogram.”...I tried to understand it enough to make a version using D3 scales. It turned out to be very simple...
  • Mass Shootings In The US
    The visualization is using data from www.shootingtracker.com and covers the period January 2013 through early December 2015. The event data (comprised of over 1000 shooting events) has been grouped into weeks...Technically, the visualization is using D3.js, Crossfilter.js and Mapbox's API...
  • Adjustable Ranges On Color Scale
    An example illustrating a scale that allows the ranges to be adjusted by the user...This example demonstrates how to construct a key from a threshold scale, in the style of Ford Fessenden’s map of police stops involving force. A linear scale is used to set the x-position of each colored rectangle in the key. There is one rectangle per color in the threshold scale’s range, and one tick per value in the threshold scale’s domain. The linear scale’s domain sets the implied extent of the key, here spanning 0 to 100%...
  • Inline Labels
    This example shows how to implement Ann K. Emery’s technique of placings labels directly on top of a line in D3 4.0 Alpha...To construct the multi-series line chart, the data is first transformed into separate arrays for each series. (The series names are automatically derived from the columns in the TSV file, thanks to a new dsv.parse feature.)...

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

Wishing you the best, 
Sebastian Gutierrez
@DashingD3js
www.dashingd3js.com

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