Skip to content

Instantly share code, notes, and snippets.

@adg29

adg29/index.html

Last active August 29, 2015 14:22
Show Gist options
  • Save adg29/742402361d7b816a284b to your computer and use it in GitHub Desktop.
Save adg29/742402361d7b816a284b to your computer and use it in GitHub Desktop.
Download ZIP
Vega Scatter Plot of Nuclear Energy Plants License Duration Per State
Raw
index.html
<!DOCTYPE html>
<meta charset="utf-8">
<link href="http://trifacta.github.com/vega/css/vega.css" rel="stylesheet">
<script src="http://d3js.org/d3.v3.min.js"></script>
<script src="http://trifacta.github.com/vega/vega.js"></script>
<script>
function parse(spec) {
vg.parse.spec(spec, function(chart) {
var view = chart({ el:"#vis" });
view.viewport(null)
.renderer("svg")
.update();
});
}
parse({
"width": 400,
"height": 384,
"padding": "auto",
"data": [
{
"name": "raw",
"format": {"type": "csv","parse": {"license_until": "date","count": "number"}},
"url": "https://s3.amazonaws.com/t-brand-studio/data/nuclear/14/nuclear-plant-data.csv",
"transform": [{"type": "filter","test": "d.data.license_until!==null"}]
},
{
"name": "table",
"source": "raw",
"transform": [
{
"type": "formula",
"field": "data.year_license_until",
"expr": "utcyear(d.data.license_until)"
},
{
"type": "aggregate",
"groupby": ["data.year_license_until","data.state"],
"fields": [{"op": "count","field": "*"}]
}
]
}
],
"marks": [
{
"_name": "cell",
"type": "group",
"properties": {"enter": {"width": {"value": 400},"height": {"value": 384}}},
"scales": [
{
"name": "x",
"type": "linear",
"domain": {"data": "table","field": "data.year_license_until"},
"range": [0,400],
"zero": false,
"reverse": false,
"round": true,
"nice": true
},
{
"name": "y",
"type": "ordinal",
"domain": {"data": "table","field": "data.state"},
"sort": true,
"bandWidth": 12,
"round": true,
"nice": true,
"points": true,
"padding": 1
},
{
"name": "size",
"type": "linear",
"domain": {"data": "table","field": "data.count"},
"range": [10,320],
"round": true,
"zero": false
}
],
"axes": [
{
"type": "x",
"scale": "x",
"grid": true,
"layer": "back",
"properties": {
"grid": {"stroke": {"value": "black"},"opacity": {"value": 0.08}},
"labels": {
"angle": {"value": 270},
"align": {"value": "right"},
"baseline": {"value": "middle"},
"text": {"template": "{{data | number:'d'}}"}
}
},
"title": "YEAR(license_until)",
"titleOffset": 60,
"orient": "top",
"tickPadding": 30
},
{
"type": "y",
"scale": "y",
"grid": true,
"layer": "back",
"properties": {"grid": {"stroke": {"value": "black"},"opacity": {"value": 0.08}}},
"title": "state",
"titleOffset": 56
}
],
"marks": [
{
"type": "symbol",
"from": {"data": "table"},
"properties": {
"enter": {
"x": {"scale": "x","field": "data.year_license_until"},
"y": {"scale": "y","field": "data.state"},
"size": {"scale": "size","field": "data.count"},
"shape": {"value": "circle"},
"stroke": {"value": "steelblue"},
"opacity": {"value": 0.7},
"strokeWidth": {"value": 2}
},
"update": {
"x": {"scale": "x","field": "data.year_license_until"},
"y": {"scale": "y","field": "data.state"},
"size": {"scale": "size","field": "data.count"},
"shape": {"value": "circle"},
"stroke": {"value": "steelblue"},
"opacity": {"value": 0.7},
"strokeWidth": {"value": 2}
}
}
}
],
"legends": [{"size": "size","orient": "right","title": "Number of Nuclear Plants"}]
}
],
"scales": []
});
</script>
<body>
<div id="vis"></div>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment