This week you’re going to prepare pitches for your next story, make sure you get your CartoDB account upgraded to Magellan, and take another stab at Highcharts. > Continue reading Homework Week 10 (Due Nov 13)
Charting tools like Highcharts give you a great deal more control over your final product than Google Spreadsheets can. For some of you they’re way more fun. For some of you they’re way more exasperating. For a lot of you, Highcharts is probably somewhere in between.
If you want to take another stab at the exercise we worked through in class, Continue reading Highcharts
We want post-mortem reports from each of you on your first major story, you have a week to take one last pass at your story, it is time to start thinking about your next story and we’re going to dive in to CartoDB next week, so you’re going to get started with some pre-learning. Continue reading Homework Week 9 (Due Nov 06)
We used a couple of helpful HTML tags to make a simple key or legend in class. We created a table using
td. We used
div to create an arbitrary box and then added a
style="" attribute to give the box a height, width and background color. If you don’t already know the colors on your gradient, take a screenshot using
cmd-shift-4. When you see the crosshairs, draw a box around the area you want a snapshot of. When you release the mouse, OSX will save an image to your desktop. Open that in Photoshop, and use the eyedropper to pick out colors. The color slider menu in Photoshop includes a “web color” mode that will give you hexadecimal color codes and an option to copy the color code directly to your clipboard.
Then, make your table. Nesting matters. The
table is the outermost tag, followed by the rows
tr and then the headings and cells
td. The code below produces the table below that.
<th colspan="2">Youth Unemployment</th>
<td><div style="background-color:#cfe2f3; width:10px; height:10px"> </div></td>
<td>Less than 2%</td>
<td><div style="background-color:#9fc5e8; width:10px; height:10px"> </div></td>
<td><div style="background-color:#6fa8dc; width:10px; height:10px"> </div></td>
<td><div style="background-color:#3d85c6; width:10px; height:10px"> </div></td>
<td><div style="background-color:#0b5394; width:10px; height:10px"> </div></td>
<td>More than 51%</td>
||Less than 2%|
||More than 51%|
Check out the full specs of the anchor tag or just view the source of a few simple pages to see how to use <a href=”http://…”> to anchor a link.
+ there are no spaces around the ” or =
+ “curly quotes” are not the same as “straight quotes”
+ close your anchor with </a>
Just to keep you on your toes, some browsers are more forgiving of stray spaces and curly quotes than others.
If you’re just getting started making maps online, start with Google Maps, but they’re not your only option. Many Eyes does well with state and country level maps. John Keefe blogs relentlessly about his Google mapping projects, how they work, and what he’s learned. CartoDB is new and more powerful and flexible than Google Maps. It is also more complex. MapBox is even more powerful, flexible, and complex.
Great places to start thinking about maps:
+ Dave Cole, John Keefe and Matt Stiles on Mapping Best Practices (NICAR 2013)
+ John Keefe, Albert Sun and Jeff Larson talk about making maps (Hacks/Hackers 2011)
+ Take Care of your Chloropleth Maps
+ When Maps Shouldn’t be Maps
+ Amanda’s maps and mapping tags on Tumblr
Continue reading Mapping
This week you’re going to make a map, do some reading and bring a couple of good pre-pitches to class. Continue reading Homework Week 4 (Due Oct 02)
You have three assignments this week. You’re going to clean a campaign finance data set, read a bit about choropleth maps and find a data set for next week that includes geographic information. Continue reading Homework Week 3(Due Sep 25)