Alyson La alysonla

A simple example demonstrating how Coördinator could be used to intersperse relevant, non-data-driven elements into a data story. The runner and Olympic logo are comprised of the circles representing relevant athletes.

Olympic data from: https://www.teamusa.org/road-to-rio-2016/team-usa/athletes

Runner icon by Christian Brunner: https://thenounproject.com/chbrunne/

Olympic logo: https://commons.wikimedia.org/wiki/File:United_States_Olympic_Committee_logo_2.svg

Snowman image via: https://thenounproject.com/marvdrock/

How to gh-pages

Create a front-end project & name index.html
cd into the project in terminal
Run git init to initialize the git repo in the project
Create & switch to branch called gh-pages - git checkout -b gh-pages
Go to github.com the website and create a new repo
Do not add a readme..
Use the cheatsheat to add the remote - git add remote....
Run git add . to add & stage all your files

	<!DOCTYPE html>
	<meta charset="utf-8">
	<style>


	</style>
	<div id='marquee'>
	</div>
	<script src="https://d3js.org/d3.v4.min.js"></script>
	<script>

	-- Active issues
	-- Count of total active issues in the specified time frame
	-- Source: githubarchive public data set via Google BigQuery http://githubarchive.org/

	SELECT
	COUNT(DISTINCT JSON_EXTRACT_SCALAR(events.payload, '$.issue.id')) AS events_issue_count
	FROM (SELECT * FROM TABLE_DATE_RANGE([githubarchive:day.],TIMESTAMP('2015-09-01'),TIMESTAMP('2016-08-31')))
	AS events

	-- 10,723,492 active issues

	with
	dau as (
	-- This part of the query can be pretty much anything.
	-- The only requirement is that it have three columns:
	-- dt, user_id, inc_amt
	-- Where dt is a date and user_id is some unique identifier for a user.
	-- Each dt-user_id pair should be unique in this table.
	-- inc_amt represents the amount of value that this user created on dt.
	-- The most common case is
	-- inc_amt = incremental revenue from the user on dt

	<!DOCTYPE html>
	<html> </html>
	Making Comments:
	<--! Make me into a comment -->
	Font Size:
	<p style = "font-size: 12px">
	Font Color:
	<h2 style="color:red">
	Font Color & Size:
	<h2 style="color: green; font-size:12px">

	license: mit
	height: 620
	border: no