Jonathan Soma jsoma

You can make a design critique request using this Google form

Critique: Ministers leaving under Theresa May (line chart)

Data Studio Charting Checklist

You can see a few suggestions at http://designingviz.com/ which may or may not be reasonable. I also really recommend The Wall Street Journal Guide to Information Graphics, a pretty tiny book that is remarkably helpful at helping you not screw things up.

Micro-tutorials for Illustrator can be found at http://jonathansoma.com/lede/data-studio/, including how to open your Python files in Illustrator. Longer, detailed Illustrator tutorials can be found on Lynda.com, accessed for free through the Columbia portal.

Communicating successfully

Story

Hosting your site on GitHub Pages

We're going to start by creating a new repository using GitHub Pages.

And we're going to name is after ourselves! My github username is jsoma, so I'm going to call my repository jsoma.gitub.io.

Name your repository YOURUSERNAME.github.io. Double-check what your GitHub username is. If you do this part wrong, you'll be sad!

Setting the style for the MapBox GL map template

Using a color scale

If you have a property called rating that goes from 0-10, this code will fill in your shape based on it. 1 will be a very light blue, 5 will be a slightly darker blue, and 10 will be even more dark. Numbers in between will be estimated (interpolated). Note that including the 5 level was not necessary - if rating were 5, MapBox GL would have guessed a color in between the 1 color and the 10 color.

'fill-color': [
      'interpolate', ['linear'],
 ["to-number", ["get", "rating"]],

Installing tweego is a little more complicated than (I think) it should be, so here's a script to do it for you. If you'd like to one-line it, you can just cut and paste this in Terminal:

/bin/bash -c "$(curl -fsSL https://gist.githubusercontent.com/jsoma/5ef3045b2004a610455f371479a6f0cf/raw/b6c9224faa18fd52f3e1bf7120af17eed6da8ec1/tweego.sh)"

Once it's installed, tweego docs are here. You'll probably want to read these twee docs, too.

	#
	# WAIT!!!
	# WAIT!!!
	# You probably don't need this any more! Newer versions of matplotlib
	# can do this with built-in magic. See these StackOverflow answers:
	#
	# https://stackoverflow.com/questions/41296313/stacked-bar-chart-with-centered-labels/60895640#60895640
	# https://stackoverflow.com/questions/28931224/adding-value-labels-on-a-matplotlib-bar-chart/67561982#67561982
	#
	# Big thanks to @trenton3983 for keeping us all up to date!

	<!DOCTYPE html>
	<style>

	.states :hover {
	fill: red;
	}

	.state-borders {
	fill: none;
	stroke: #fff;

	### MATPLOTLIBRC FORMAT

	#
	# See http://matplotlib.org/users/customizing.html#the-matplotlibrc-file for
	# more details on the paths which are checked for the configuration file.
	#

	### LINES
	# See http://matplotlib.org/api/artist_api.html#module-matplotlib.lines for more
	# information on line properties.