Skip to content

Instantly share code, notes, and snippets.

@korenmiklos

korenmiklos/ajax.html

Last active December 11, 2015 17:18
Show Gist options
  • Save korenmiklos/4633010 to your computer and use it in GitHub Desktop.
Save korenmiklos/4633010 to your computer and use it in GitHub Desktop.
Download ZIP
Prototype of Graphing App
Raw
ajax.html
<!DOCTYPE html>
<meta charset="utf-8">
<html><head>
<script src="http://d3js.org/d3.v3.min.js"></script>
</head>
<body>
<script>
d3.json("http://htsql.coauthors.net/htsql/industry?country='austria'/:json", function(d) { console.log(d);});
</script>
</body>
</html>
Raw
index.html
<html>
<head>
<title>CEU MicroData</title>
<script>
d3.json("http://htsql.coauthors.net/htsql/industry?country='austria'/:json", function(d) { console.log(d);});
</script>
</head>
<body>
<div id="header">
<h1>CEU MicroData</h1>
</div>
<div id="line-chart" style="width:650px;">
<h2>Industrial production growth</h2>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/static/modules/gviz/1.0/chart.js"> {"dataSourceUrl":"//docs.google.com/spreadsheet/tq?key=0AhJS2rfBAT8JdFJveVd5ZG5YZlFhek00NVlISml1R0E&transpose=0&headers=1&range=E277%3AH406&gid=0&pub=1","options":{"displayAnnotations":true,"titleTextStyle":{"fontSize":16},"vAxes":[{"useFormatFromData":true,"title":"Left vertical axis title","minValue":null,"viewWindow":{"min":null,"max":null},"maxValue":null},{"useFormatFromData":true,"minValue":null,"viewWindow":{"min":null,"max":null},"maxValue":null}],"booleanRole":"certainty","title":"Chart title","allValuesSuffix":"%","thickness":"2","displayZoomButtons":false,"wmode":"opaque","hAxis":{"useFormatFromData":true,"title":"Horizontal axis title","minValue":null,"viewWindow":{"min":null,"max":null},"maxValue":null},"width":609,"height":320},"state":{},"view":{},"chartType":"AnnotatedTimeLine","chartName":"Chart 2"} </script>
<div>
Source: Eurostat. Monthly growth rate of production volume index on year-ago level (seasonally adjusted). 3-month moving average.
</div>
</div>
<div id="bar-chart" style="width:650px;">
<script type="text/javascript" src="//ajax.googleapis.com/ajax/static/modules/gviz/1.0/chart.js"> {"dataSourceUrl":"//docs.google.com/spreadsheet/tq?key=0AhJS2rfBAT8JdFJveVd5ZG5YZlFhek00NVlISml1R0E&transpose=0&headers=1&range=A1%3AB100&gid=2&pub=1","options":{"vAxes":[{"useFormatFromData":true,"title":null,"minValue":null,"logScale":false,"viewWindow":{"min":null,"max":null},"maxValue":null},{"useFormatFromData":true,"minValue":null,"logScale":false,"viewWindow":{"min":null,"max":null},"maxValue":null}],"titleTextStyle":{"bold":true,"color":"#000","fontSize":16},"booleanRole":"certainty","title":"Growth rate as of November 2012","animation":{"duration":0},"legend":"right","hAxis":{"useFormatFromData":true,"minValue":null,"viewWindowMode":null,"viewWindow":null,"maxValue":null},"isStacked":false,"width":1115,"height":543},"state":{},"view":{},"chartType":"ColumnChart","chartName":"Chart 2"} </script>
</div>
<div id="commentary">
Things go up. They then come down again. They have never remained up thus far.
</div>
<div>
Footer text here.
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment