<commit_before><head>
	<title>WRAL data interactives</title>
	<link href="https://fonts.googleapis.com/css?family=PT+Sans:400,400italic,700%7CDroid+Sans:400,700%7CArvo:400,700" rel="stylesheet" type="text/css">
	<link rel="stylesheet" href="/main.min.css?v=20150223a">
	<link rel="Shortcut Icon" href="http://wwwcache.wral.com/favicon.ico" />
</head>
<body class="wral">
	<div class="g-wrap">
	<div class="container">
	<div class="1-default">
		<h2 style="margin-top:20px;">WRAL data interactives</h2>
		<p>This is how the data team at WRAL News organizes recurring code for its interactives, visualizations and applications.</p>
		<p><b>Note:</b> Although most of the code instructions contained on these pages will be specific for WRAL's content management system, feel free to make use of the code for the demos on the page (for example, by viewing the page's source).</p>
		<img src="./images/data-ink.gif" />
		<p>Remember: <a href="http://www.darkhorseanalytics.com/blog/data-looks-better-naked">data look better naked</a>.</p>
		<h3 >Responsive mapping</h3>
		<ul>
			<li><h5 style="margin-bottom:0px;">Leaflet</h5>
				<i>A javascript library for creating interactive, detailed maps using tile layers.</i></li>
			<ul>
				<li><a href="/leaflet-nc-counties.html">Mapping NC counties</a></li>
				<li>Mapping US states</li>
			</ul>
			<li><h5 style="margin-bottom:0px;margin-top:10px;">D3</h5>
				<i>A javascript library for visualization using HTML, CSS and SVG.</i></li>
			<ul>
				<li><a href="/d3-nc-counties.html">NC counties</a></li>
				<li><a href="/d3-us-states.html">US states</a></li>
			</ul>
		</ul>

		<h3 style="margin-top:20px;">Charts/graphics</h3>
		<ul>
			<li><a href="/jqplot-simple-bar.html">Simple bar chart with jqPlot</a></li>
			<li>Fever charts</li>
			<li><a href="/wordcloud.html">Word clouds</a></li>
		</ul>

		<h3 style="margin-top:20px;">Responsive tables</h3>
		<ul>
			<li>Mapping with tables</li>
		</ul>

		<h3 style="margin-top:20px;">Quizzes</h3>
		<ul>
			<li>Random vs. fixed</li>
		</ul>

		<h3 style="margin-top:20px;">Live examples</h3>
		<ul>
			<li><a href="http://www.wral.com/how-2-redrawn-districts-could-affect-most-nc-voters/15339226/">Steppable leaflet map views with triggered events</a></li>
			<li><a href="http://www.wral.com/why-new-districts-may-change-who-you-elect-to-congress/15383198/">Leaflet location with Wherewolf and selectable dataset</a></li>
			<li><a href="http://www.wral.com/search-thousands-of-unc-scandal-records/15030171/">Searchable documents via DocumentCloud</a></li>
			<li><a href="http://wral.com/14958080">User-filtered markers on NC map with leaflet</a></li>
			<li><a href="http://www.wral.com/critics-say-proposal-to-cut-food-benefits-will-hit-rural-areas-hard/14943882/">Selectable choropleth of NC counties with D3, multiple variables</a></li>
			<li><a href="http://www.wral.com/food-stamp-map/14943126/">Selectable NC counties with D3 (Storyteller/Fullscreen version)</a></li>
			<li><a href="http://www.wral.com/both-sides-of-confederate-debate-pressure-mccrory-to-act/14790770/">Single variable choropleth of NC counties with D3</a></li>
			<li><a href="http://www.wral.com/rural-hospitals-in-trouble/14614839/">U.S. states with D3</a></li>
			<li><a href="http://www.wral.com/highway-funding-sees-federal-retreat-across-most-states/14437962/">U.S. states with D3 (selectable datasets)</a></li>
			<li><a href="http://www.wral.com/explore-tests-of-well-water-near-duke-coal-ash-ponds/14735307/">Leaflet map of NC with custom markers</a></li>
			<li><a href="http://www.wral.com/news/state/page/14027662/">Table/county map with Leaflet/Footables</a></li>
			<li><a href="http://www.wral.com/news/state/nccapitol/page/14375698/">Leaflet location with Wherewolf</a></li>
			<li><a href="http://www.wral.com/as-staff-shortages-persist-prison-chiefs-push-for-raises/14740160/">Selectable line chart with jqPlot</a></li>
			<li><a href="http://www.wral.com/in-2014-midterm-turnout-shows-tiny-voter-shifts/14302061/">County map with D3 and graphs with jqPlot</a></li>
			<li><a href="http://www.wral.com/fact-check-the-senate-debate/14053754/">Responsive table with Footable</a></li>
			<li><a href="http://www.wral.com/across-nc-heavy-fines-wane-for-top-polluters/13571070/">Stacked bar charts with jqPlot</a></li>
			<li><a href="http://www.wral.com/size-of-food-stamp-backlog-dwindles/13424836/">Fever chart with milestones</a></li>
			<li><a href="http://www.wral.com/-price-of-vision-much-higher-for-nc-medicare-patients/13592597/">Simple bar chart with jqPlot</a></li>
			<li><a href="http://www.wral.com/news/local/page/13499869/">Quiz with random question selection</a></li>
			<li><a href="http://www.wral.com/lifestyles/healthteam/page/14459707/">Quiz with fixed question selection</a></li>
		</ul>

		<h3 style="margin-top:20px;">Other inspiration</h3>
		<ul>
			<li><a href="http://eyeseast.github.io/visible-data/">Visible Data // <NAME></a></li>
			<li><a href="https://github.com/mbostock/d3/wiki/Gallery">D3 example gallery // <NAME></li>
			<li><a href="http://www.jqplot.com/deploy/dist/examples/">jqPlot example gallery</a></li>
			<li><a>Source: journalism code and the people who make it</a></li>
			<li><a href="https://www.propublica.org/article/how-information-graphics-reveal-your-brains-blind-spots">How Information Graphics Reveal Your Brain’s Blind Spots</a></li>
			<li><a href="https://www.washingtonpost.com/news/wonk/wp/2016/04/11/the-dirty-little-secret-that-data-journalists-arent-telling-you/">Why visualizing data is sometimes more art than science</a></li>
		</ul>

		<h3 style="margin-top:20px;">Docs docs docs</h3>
		<ul>
			<li><a href="http://leafletjs.com/reference.html">Leaflet docs</a></li>
			<li><a href="http://leaflet-extras.github.io/leaflet-providers/preview/">Leaflet tile options</a></li>
			<li><a href="https://github.com/mbostock/d3/wiki">D3 docs</a></li>
			<li><a href="http://fooplugins.com/footable-demos/">Footable docs</a></li>
			<li><a href="http://www.jqplot.com/docs/files/usage-txt.html">jqPlot docs</a></li>
			<li><a href="http://colorbrewer2.org/">Colorbrewer for selecting map color thresholds</a></li>
		</ul>

		<p>Questions? <a href="mailto:<EMAIL>">Contact <NAME></a>.</p>
		
	</div>
	</div>
	</div>
</body>

<commit_msg>cleanin up gif<commit_after><head>
	<title>WRAL data interactives</title>
	<link href="https://fonts.googleapis.com/css?family=PT+Sans:400,400italic,700%7CDroid+Sans:400,700%7CArvo:400,700" rel="stylesheet" type="text/css">
	<link rel="stylesheet" href="/main.min.css?v=20150223a">
	<link rel="Shortcut Icon" href="http://wwwcache.wral.com/favicon.ico" />
	<style>
	img {
		width: 100%;
		height: auto;
	}
	</style>
</head>
<body class="wral">
	<div class="g-wrap">
	<div class="container">
	<div class="1-default">
		<h2 style="margin-top:20px;">WRAL data interactives</h2>
		<p>This is how the data team at WRAL News organizes recurring code for its interactives, visualizations and applications.</p>
		<p><b>Note:</b> Although most of the code instructions contained on these pages will be specific for WRAL's content management system, feel free to make use of the code for the demos on the page (for example, by viewing the page's source).</p>
		<p>Remember: <a href="http://www.darkhorseanalytics.com/blog/data-looks-better-naked">data look better naked</a>.</p>
		<div style="max-width:400px;">
			<img style="display: block;margin: 0 auto;"src="./images/data-ink.gif" />
		</div>
		<h3 >Responsive mapping</h3>
		<ul>
			<li><h5 style="margin-bottom:0px;">Leaflet</h5>
				<i>A javascript library for creating interactive, detailed maps using tile layers.</i></li>
			<ul>
				<li><a href="/leaflet-nc-counties.html">Mapping NC counties</a></li>
				<li>Mapping US states</li>
			</ul>
			<li><h5 style="margin-bottom:0px;margin-top:10px;">D3</h5>
				<i>A javascript library for visualization using HTML, CSS and SVG.</i></li>
			<ul>
				<li><a href="/d3-nc-counties.html">NC counties</a></li>
				<li><a href="/d3-us-states.html">US states</a></li>
			</ul>
		</ul>

		<h3 style="margin-top:20px;">Charts/graphics</h3>
		<ul>
			<li><a href="/jqplot-simple-bar.html">Simple bar chart with jqPlot</a></li>
			<li>Fever charts</li>
			<li><a href="/wordcloud.html">Word clouds</a></li>
		</ul>

		<h3 style="margin-top:20px;">Responsive tables</h3>
		<ul>
			<li>Mapping with tables</li>
		</ul>

		<h3 style="margin-top:20px;">Quizzes</h3>
		<ul>
			<li>Random vs. fixed</li>
		</ul>

		<h3 style="margin-top:20px;">Live examples</h3>
		<ul>
			<li><a href="http://www.wral.com/how-2-redrawn-districts-could-affect-most-nc-voters/15339226/">Steppable leaflet map views with triggered events</a></li>
			<li><a href="http://www.wral.com/why-new-districts-may-change-who-you-elect-to-congress/15383198/">Leaflet location with Wherewolf and selectable dataset</a></li>
			<li><a href="http://www.wral.com/search-thousands-of-unc-scandal-records/15030171/">Searchable documents via DocumentCloud</a></li>
			<li><a href="http://wral.com/14958080">User-filtered markers on NC map with leaflet</a></li>
			<li><a href="http://www.wral.com/critics-say-proposal-to-cut-food-benefits-will-hit-rural-areas-hard/14943882/">Selectable choropleth of NC counties with D3, multiple variables</a></li>
			<li><a href="http://www.wral.com/food-stamp-map/14943126/">Selectable NC counties with D3 (Storyteller/Fullscreen version)</a></li>
			<li><a href="http://www.wral.com/both-sides-of-confederate-debate-pressure-mccrory-to-act/14790770/">Single variable choropleth of NC counties with D3</a></li>
			<li><a href="http://www.wral.com/rural-hospitals-in-trouble/14614839/">U.S. states with D3</a></li>
			<li><a href="http://www.wral.com/highway-funding-sees-federal-retreat-across-most-states/14437962/">U.S. states with D3 (selectable datasets)</a></li>
			<li><a href="http://www.wral.com/explore-tests-of-well-water-near-duke-coal-ash-ponds/14735307/">Leaflet map of NC with custom markers</a></li>
			<li><a href="http://www.wral.com/news/state/page/14027662/">Table/county map with Leaflet/Footables</a></li>
			<li><a href="http://www.wral.com/news/state/nccapitol/page/14375698/">Leaflet location with Wherewolf</a></li>
			<li><a href="http://www.wral.com/as-staff-shortages-persist-prison-chiefs-push-for-raises/14740160/">Selectable line chart with jqPlot</a></li>
			<li><a href="http://www.wral.com/in-2014-midterm-turnout-shows-tiny-voter-shifts/14302061/">County map with D3 and graphs with jqPlot</a></li>
			<li><a href="http://www.wral.com/fact-check-the-senate-debate/14053754/">Responsive table with Footable</a></li>
			<li><a href="http://www.wral.com/across-nc-heavy-fines-wane-for-top-polluters/13571070/">Stacked bar charts with jqPlot</a></li>
			<li><a href="http://www.wral.com/size-of-food-stamp-backlog-dwindles/13424836/">Fever chart with milestones</a></li>
			<li><a href="http://www.wral.com/-price-of-vision-much-higher-for-nc-medicare-patients/13592597/">Simple bar chart with jqPlot</a></li>
			<li><a href="http://www.wral.com/news/local/page/13499869/">Quiz with random question selection</a></li>
			<li><a href="http://www.wral.com/lifestyles/healthteam/page/14459707/">Quiz with fixed question selection</a></li>
		</ul>

		<h3 style="margin-top:20px;">Other inspiration</h3>
		<ul>
			<li><a href="http://eyeseast.github.io/visible-data/">Visible Data // <NAME></a></li>
			<li><a href="https://github.com/mbostock/d3/wiki/Gallery">D3 example gallery // <NAME></li>
			<li><a href="http://www.jqplot.com/deploy/dist/examples/">jqPlot example gallery</a></li>
			<li><a>Source: journalism code and the people who make it</a></li>
			<li><a href="https://www.propublica.org/article/how-information-graphics-reveal-your-brains-blind-spots">How Information Graphics Reveal Your Brain’s Blind Spots</a></li>
			<li><a href="https://www.washingtonpost.com/news/wonk/wp/2016/04/11/the-dirty-little-secret-that-data-journalists-arent-telling-you/">Why visualizing data is sometimes more art than science</a></li>
		</ul>

		<h3 style="margin-top:20px;">Docs docs docs</h3>
		<ul>
			<li><a href="http://leafletjs.com/reference.html">Leaflet docs</a></li>
			<li><a href="http://leaflet-extras.github.io/leaflet-providers/preview/">Leaflet tile options</a></li>
			<li><a href="https://github.com/mbostock/d3/wiki">D3 docs</a></li>
			<li><a href="http://fooplugins.com/footable-demos/">Footable docs</a></li>
			<li><a href="http://www.jqplot.com/docs/files/usage-txt.html">jqPlot docs</a></li>
			<li><a href="http://colorbrewer2.org/">Colorbrewer for selecting map color thresholds</a></li>
		</ul>

		<p>Questions? <a href="mailto:<EMAIL>">Contact <NAME></a>.</p>
		
	</div>
	</div>
	</div>
</body>


{'fraction_non_alphanumeric': 0.20292360892801006, 'fraction_numerical': 0.040946243319710786, 'mean_word_length': 4.391949152542373, 'pattern_counts': {'":': 0, '<': 477, '<?xml version=': 0, '>': 477, 'https://': 10, 'lorem ipsum': 0, 'www.': 50, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '589875', 'n_tokens_mistral': 5559, 'n_tokens_neox': 4785, 'n_words': 803}