Skip to content

Instantly share code, notes, and snippets.

@ohdebby

ohdebby/Food Stamps

Created January 7, 2016 23:29
Show Gist options
  • Save ohdebby/1e6b01ee3261777fb605 to your computer and use it in GitHub Desktop.
Save ohdebby/1e6b01ee3261777fb605 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
Food Stamps
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
<title>Food Stamp Nation</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=0.95, maximum-scale=0.95, user-scalable=0" />
<!--[if lt IE 9]>
<script src="js/json2.min.js"></script>
<script type="text/javascript">
window.__ltie9 = true;
</script>
<![endif]-->
<link rel="alternate" type="application/json+oembed" href="https://datawrapper.de/api/plugin/oembed?url=https%3A%2F%2Fcharts.datawrapper.de%2F4dLP3%2F&amp;format=json" title="Food Stamp Nation" />
<link rel="stylesheet" type="text/css" href="css/4dLP3.all.css"></link>
<script type="text/javascript" charset="utf-8">
window.__locale = 'en-US';
</script>
<script type="text/javascript" charset="utf-8" src="js/globalize.min.js"></script>
<script type="text/javascript" charset="utf-8" src="js/globalize.culture.en-US.js"></script>
<script type="text/javascript" charset="utf-8" src="js/underscore-min.js"></script>
<script type="text/javascript" charset="utf-8" src="js/jquery.min.js"></script>
<script type="text/javascript" charset="utf-8" src="//datawrapper.dwcdn.net/assets/vendor/raphael-js/2.1.2/raphael-min.js"></script>
<script type="text/javascript" charset="utf-8" src="//datawrapper.dwcdn.net/assets/vendor/chroma-js/0.5.4/chroma.min.js"></script>
<script type="text/javascript" charset="utf-8" src="//datawrapper.dwcdn.net/assets/vendor/d3-light/3.1.8/d3-light.min.js"></script>
<script type="text/javascript" charset="utf-8" src="js/line-chart-37a392e59de959c9efdcc110e96d534e.min.js"></script>
<script type="text/javascript" charset="utf-8" src="js/default-5baee189e1a2f0bf680f4910cc958098.min.js"></script>
<script type="text/javascript" charset="utf-8" src="js/chart-753c771b6f0ebc215cab76b0fca5e03aab20b743.min.js"></script>
</head>
<body class="dw-chart chart theme-default vis-line-chart">
<div class="dw-chart-header" id="header">
<h1 >
<span class="chart-title">Food Stamp Nation</span>
</h1>
<p class="chart-intro hidden"></p>
</div>
<div class="dw-chart-body" id="chart"></div>
<div class="dw-chart-footer" id="footer">
<div class="footer-left">
<span data-src="Source: " class="source-block">Source: US Dept of Agriculture</span>
<a href="data.csv">Get the data</a>
</div>
<div class="footer-right">
Created with <a href="datawrapper.de" target="_blank">Datawrapper</a>
</div>
</div>
<script type="text/javascript" charset="utf-8">
if (document.getElementsByTagName('script').length > 0) $('body').addClass('js');
__dw.init({
chartJSON: {"id":"4dLP3","title":"Food Stamp Nation","theme":"default","createdAt":"2016-01-07 23:45:35","lastModifiedAt":"2016-01-08 00:21:50","type":"line-chart","metadata":{"data.csv":{"transpose":false,"vertical-header":true,"horizontal-header":true,"changes":[{"row":0,"column":0,"value":"Year"},{"row":0,"column":1,"value":"Participants"},{"row":0,"column":1,"value":"Participants (millions)"},{"row":0,"column":2,"value":"costs ($ Billions)"}]},"visualize":{"highlighted-series":[],"highlighted-values":[],"filter-missing-values":true,"ignore-missing-values":false,"grid-lines":false,"sort-values":true,"show-total":true,"custom-total":false,"group-slice-after":"5","map":"1-world","map-path":"plugins\/visualization-maps\/maps\/1-world","gradient":{"classes-number":5,"class-limit-mode":"equidistant","domain":[0.25,16.186,32.122,48.058,63.994,79.93],"range":{"min":0.25,"max":79.93},"custom-limits":[],"colors":["#fefaca","#008b15"],"chromajs-constructor":"chroma.scale([\"#fefaca\",\"#008b15\"]).domain([0.25,16.186,32.122,48.058,63.99400000000001,79.93]).mode('lab');"},"direct-labeling":true,"legend-position":"right","show-grid":false,"fill-between":false,"line-mode":"straight","scale-y1":"linear","user-change-scale":false,"base-color":0,"custom-colors":{"costs":"#ff7f0e"},"connect-missing-values":false,"annotate-time-axis":"1969-12-15,1970-11-15\n1973-11-15,1975-03-15\n1980-01-15,1980-07-15\n1981-07-15,1982-11-15\n1990-07-15,1991-03-15\n2001-03-15,2001-11-15\n2007-12-15,2009-06-15, Recession"},"describe":{"source-name":"US Dept of Agriculture","source-url":"","number-format":"-","number-divisor":0,"number-append":"","number-prepend":"","intro":""},"publish":{"embed-width":"600","embed-height":"400","background":"#ffffff","text":"#000000"}},"authorId":45825,"showInGallery":false,"language":null,"guestSession":null,"lastEditStep":5,"publishedAt":"2016-01-08 00:21:55","publicUrl":"https:\/\/charts.datawrapper.de\/4dLP3\/index.html","publicVersion":1,"organizationId":null,"forkedFrom":null},
chartLocale: 'en-US',
themeId: 'default',
visId: 'line-chart',
visJSON: {"title":"Line Chart","id":"line-chart","extends":"raphael-chart","dimensions":2,"order":40,"axes":{"x":{"accepts":["text","date"]},"y1":{"accepts":["number"],"multiple":true},"y2":{"accepts":["number"],"multiple":true,"optional":true}},"options":{"base-color":{"type":"base-color","label":"Base color"},"sep-labeling":{"type":"separator","label":"Customize labeling","depends-on":{"chart.min_columns[y1]":2}},"direct-labeling":{"type":"checkbox","label":"Direct labeling","default":false,"depends-on":{"chart.min_columns[y1]":2,"chart.max_columns[y2]":0},"help":"Show the labels right nearby the line ends instead of a separate legend"},"legend-position":{"type":"radio-left","label":"Legend position","default":"right","depends-on":{"direct-labeling":false,"chart.min_columns[y1]":2},"options":[{"value":"right","label":"right"},{"value":"top","label":"top"},{"value":"inside","label":"inside left"},{"value":"inside-right","label":"inside right"}]},"sep-lines":{"type":"separator","label":"Customize lines"},"show-grid":{"type":"checkbox","hidden":true,"label":"Show grid","default":false},"connect-missing-values":{"type":"checkbox","label":"Connect lines between missing values"},"fill-between":{"type":"checkbox","label":"Fill area between lines","default":false,"depends-on":{"chart.min_columns[y1]":2,"chart.max_columns[y1]":2,"chart.max_columns[y2]":0}},"fill-below":{"type":"checkbox","label":"Fill area below line","defaut":false,"depends-on":{"chart.min_columns[y1]":1,"chart.max_columns[y1]":1,"chart.max_columns[y2]":0}},"banking":{"type":"linechart-banking","label":"Suggest aspect ratio that banks average line slopes to 45\u00b0","help":"Adjust the chart height so that the lines are banked to 45\u00b0 (on average). Can help to avoid exaggerating and understating of slopes."},"line-mode":{"type":"radio-left","label":"Line interpolation","options":[{"label":"Straight","value":"straight"},{"label":"Curved","value":"curved"},{"label":"Stepped","value":"stepped"}],"default":"straight"},"sep-y-axis":{"type":"separator","label":"Customize y-axis"},"custom-range-y":{"type":"custom-range","label":"Custom range","help":"This feature allows you to explicitely extend the y axis to custom values. Swap min\/max to invert the axis."},"scale-y1":{"type":"radio-left","label":"Scale (y-axis)","options":[{"label":"linear","value":"linear"},{"label":"logarithmic","value":"log"}],"default":"linear","depends-on":{"chart.min_value[y1]":">0","chart.magnitude_range[y1]":">3"}},"user-change-scale":{"type":"checkbox","label":"Let user change scale","default":false,"depends-on":{"chart.min_value[y1]":">0","chart.magnitude_range[y1]":">3"}},"annotate-time-axis":{"type":"textarea","label":"Annotate x axis:","placeholder":"from,to,text","width":"180px"}},"locale":{"tooManyLinesToLabel":"Your chart contains <b>more lines than we can label<\/b>, so automatic labeling is turned off. To fix this <ul><li>filter some columns in the data table in the previous step, or<\/li><li>use direct labeling and the highlight feature to label the lines that are important to your story.<\/li><\/ul>","useLogarithmicScale":"Use logarithmic scale","couldNotParseAllDates":"Some of the <b>dates in your x-axis could not be parsed<\/b>, hence the line chart cannot display a proper date axis. To fix this<ul><li>return to the previous step and clean your date column.<\/li><li><a href=\"http:\/\/blog.datawrapper.de\/2013\/cleaning-your-data-in-datawrapper\/\">Read more about how to do this.<\/a><\/li><\/ul>"},"__static_path":"assets\/plugins\/visualization-line-chart\/","__plugin":"visualization-line-chart","version":"1.5.0","icon":"<?xml version=\"1.0\" encoding=\"utf-8\"?>\n<!-- Generator: Adobe Illustrator 16.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->\n<!DOCTYPE svg PUBLIC \"-\/\/W3C\/\/DTD SVG 1.1 Basic\/\/EN\" \"http:\/\/www.w3.org\/Graphics\/SVG\/1.1\/DTD\/svg11-basic.dtd\">\n<svg version=\"1.1\" baseProfile=\"basic\" id=\"Ebene_1\"\n\t xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\" x=\"0px\" y=\"0px\" width=\"100px\" height=\"100px\"\n\t viewBox=\"0 0 100 100\" xml:space=\"preserve\">\n<g>\n\t<line fill=\"none\" stroke=\"#000000\" stroke-width=\"0.5\" stroke-miterlimit=\"10\" x1=\"9\" y1=\"79.5\" x2=\"91\" y2=\"79.5\"\/>\n\t<line fill=\"none\" stroke=\"#000000\" stroke-width=\"0.5\" stroke-miterlimit=\"10\" x1=\"9\" y1=\"59.5\" x2=\"91\" y2=\"59.5\"\/>\n\t<line fill=\"none\" stroke=\"#000000\" stroke-width=\"0.5\" stroke-miterlimit=\"10\" x1=\"9\" y1=\"39.5\" x2=\"91\" y2=\"39.5\"\/>\n\t<line fill=\"none\" stroke=\"#000000\" stroke-width=\"0.5\" stroke-miterlimit=\"10\" x1=\"9\" y1=\"19.5\" x2=\"91\" y2=\"19.5\"\/>\n<\/g>\n<line fill=\"none\" stroke=\"#000000\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-miterlimit=\"10\" x1=\"10\" y1=\"75.814\" x2=\"35.937\" y2=\"42.674\"\/>\n<line fill=\"none\" stroke=\"#000000\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-miterlimit=\"10\" x1=\"35.937\" y1=\"42.674\" x2=\"62.719\" y2=\"55.584\"\/>\n<line fill=\"none\" stroke=\"#000000\" stroke-width=\"4\" stroke-linecap=\"round\" stroke-miterlimit=\"10\" x1=\"62.719\" y1=\"55.584\" x2=\"90.562\" y2=\"23.755\"\/>\n<\/svg>\n","hasCSS":true},
metricPrefix: {"3":"k","6":"m","9":"b","12":"t"},
lang: 'en',
data: "\"year\",\"participants\",\"costs\"\n1969,2.88,0.25\n1970,4.34,0.58\n1971,9.37,1.58\n1972,11.11,1.87\n1973,12.17,2.21\n1974,12.86,2.84\n1975,17.06,4.62\n1976,18.55,5.69\n1977,17.08,5.46\n1978,16.00,5.52\n1979,17.65,6.94\n1980,21.08,9.21\n1981,22.43,11.23\n1982,21.72,10.84\n1983,21.63,11.85\n1984,20.85,11.58\n1985,19.90,11.70\n1986,19.43,11.64\n1987,19.11,11.60\n1988,18.65,12.32\n1989,18.81,12.90\n1990,20.05,15.45\n1991,22.62,18.75\n1992,25.41,22.46\n1993,26.99,23.65\n1994,27.47,24.49\n1995,26.62,24.62\n1996,25.54,24.33\n1997,22.86,21.51\n1998,19.79,18.99\n1999,18.18,17.82\n2000,17.19,17.05\n2001,17.32,17.79\n2002,19.10,20.64\n2003,21.25,23.82\n2004,23.81,27.10\n2005,25.63,31.07\n2006,26.55,32.90\n2007,26.32,33.17\n2008,28.22,37.64\n2009,33.49,53.62\n2010,40.30,68.28\n2011,44.71,75.69\n2012,46.61,78.41\n2013,47.64,79.93\n2014,46.54,73.92\n"
});
</script>
<script type="text/javascript">
setTimeout(function() {
var ref = document.referrer ? document.referrer.match(/^https?\:\/\/([^\/?#]+)(?:[\/?#]|$)/i)[1] : '';
var img = document.createElement('img');
img.setAttribute('width', 1);
img.setAttribute('height', 1);
img.setAttribute('src', '//stats.datawrapper.de/4dLP3/pixel.gif?r='+ref);
document.body.appendChild(img);
},10);
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment