Skip to content

Instantly share code, notes, and snippets.

@cjhin
cjhin / README.md
Last active Jul 24, 2016
hello world
View README.md

Test Header

Test a different header

test italic things

test bold things

  • test (asterisk) bullet points
@cjhin
cjhin / README.md
Last active Jul 24, 2016
Major League Soccer
View README.md

Major League Soccer season data (1996 - 2015)

I originally wanted to do a ranked bump chart but ended up finding the point spread to be more interesting/legible.

How To:

  • Hover over a point to view data for that club/season.
  • Click on a point to highlight all data points for that club.
View index.html
<!DOCTYPE html>
<meta charset="utf-8">
<style>
.zipcode {
stroke: steelblue;
fill: #FFF;
}
</style>
<script src="//d3js.org/d3.v3.min.js"></script>
@cjhin
cjhin / README.md
Last active Jul 24, 2016
fun (small) chart datasets
View README.md
@cjhin
cjhin / Violations-2012.csv
Last active Aug 4, 2016
health violations
View Violations-2012.csv
violation_id inspection_id violation_category violation_date violation_date_closed violation_type
204851 261019 Garbage and Refuse 2012-01-03 00:00:00 2012-02-02 00:00:00 Refuse Accumulation
204852 261019 Unsanitary Conditions 2012-01-03 00:00:00 2012-02-02 00:00:00 Unsanitary conditions, not specified
204853 261023 Garbage and Refuse 2012-01-03 00:00:00 2012-01-17 00:00:00 Refuse Accumulation
204854 261023 Garbage and Refuse 2012-01-03 00:00:00 2012-01-17 00:00:00 Refuse Accumulation
204858 261029 Garbage and Refuse 2012-01-03 00:00:00 2012-03-12 00:00:00 Refuse Accumulation
204859 261029 Animals and Pests 2012-01-03 00:00:00 2012-03-12 00:00:00 Animals and Pests, not specified
207746 264687 Animals and Pests 2012-02-08 00:00:00 2012-04-02 00:00:00 Animals and Pests, not specified
205869 262387 Garbage and Refuse 2012-01-13 00:00:00 2012-01-17 00:00:00 Refuse Accumulation
207417 264347 Garbage and Refuse 2012-01-11 00:00:00 2012-01-13 00:00:00 Refuse Accumulation
View index.html
<!DOCTYPE html>
<meta charset="utf-8">
<style>
</style>
<body>
<svg width=960 height=500></svg>
</body>
<script src="//d3js.org/d3.v3.min.js"></script>
View index.html
<!DOCTYPE html>
<meta charset="utf-8">
<body>
<canvas id="canvas" width="960" height="500"></canvas>
</body>
<script>
/*
Basically playing around with a couple of graphics things with the canvas:
@cjhin
cjhin / data.csv
Last active Aug 10, 2016
d3_example
View data.csv
X_VAR Y_VAR
A .08167
B .01492
C .02782
D .04253
E .12702
F .02288
G .02015
H .06094
I .06966
View index.html
<!DOCTYPE html>
<meta charset="utf-8">
<style>
.bird {
stroke: grey;
stroke-width: 2;
fill: none;
}
</style>
View index.html
<!DOCTYPE html>
<meta charset="utf-8">
<style>
.triangle-gold {
fill: gold;
}
.triangle-flashing {
fill: white;
transition: fill 1.5s ease;