Team:UT Dallas/infographics.js
From 2012.igem.org
(Difference between revisions)
Line 21: | Line 21: | ||
}, | }, | ||
vAxis: { | vAxis: { | ||
- | maxValue: | + | maxValue: 40, |
baselineColor: "white", | baselineColor: "white", | ||
title: "Year", | title: "Year", | ||
Line 33: | Line 33: | ||
}, | }, | ||
hAxis: { | hAxis: { | ||
- | maxValue: | + | maxValue: 40, |
baselineColor: "white", | baselineColor: "white", | ||
title: "Tracks", | title: "Tracks", |
Revision as of 01:22, 26 September 2012
function init_tracks_graph() {
function n(c) { c.disabled = true; google.visualization .events .addListener(h, "ready", function () { c.disabled = false }); h.draw(b, a) } var a = { width: 995, height: 450, backgroundColor: { fill: "none" }, legend: { textStyle: { color: "white" } }, vAxis: {
maxValue: 40,
baselineColor: "white", title: "Year", textStyle: { color: "white" }, titleTextStyle: { color: "#ffffff", fontSize: 16 } }, hAxis: {
maxValue: 40,
baselineColor: "white", title: "Tracks", textStyle: { color: "white" }, titleTextStyle: { color: "#ffffff", fontSize: 16 } }, animation: { duration: 1e3, easing: "inAndOut" } }; var b = []; var c = google.visualization .arrayToDataTable([ ["Year", "Food/Energy", "Environment", "Foundational Research", "Information Processing", "Health/Medicine", "Not Specified"], ["2007", 7, 9, 18, 10, 9, 6] ]); var d = google.visualization .arrayToDataTable([ ["Year", "Not Specified"], ["2008", 82] ]); var e = google.visualization .arrayToDataTable([ ["Year", "Food/Energy", "Environment", "Foundational Research", "Information Processing", "Health/Medicine", "Manufacturing", "New Application", "Software Tools", "Not Specified"], ["2009", 8, 16, 21, 8, 15, 14, 13, 8, 2] ]); var f = google.visualization .arrayToDataTable([ ["Year", "Food/Energy", "Environment", "Foundational Research", "Information Processing", "Health/Medicine", "Manufacturing", "New Application", "Software Tools", "Not Specified"], ["2010", 12, 16, 20, 6, 20, 17, 20, 6, 1] ]); var g = google.visualization .arrayToDataTable([ ["Year", "Food/Energy", "Environment", "Foundational Research", "Information Processing", "Health/Medicine", "Manufacturing", "New Application", "Software Tools", "Not Specified"], ["2011", 15, 25, 26, 10, 13, 15, 31, 8, 8] ]); var h = new google.visualization .BarChart(document.getElementById("tracks_graphs")); var i = document.getElementById("b2011"); var j = document.getElementById("b2010"); var k = document.getElementById("b2009"); var l = document.getElementById("b2008"); var m = document.getElementById("b2007"); b = g; i.onclick = function () { b = g; setTimeout("document.getElementById('year_no_tracks').innerHTML='Year 2011';", 1e3); n(i) }; j.onclick = function () { b = f; setTimeout("document.getElementById('year_no_tracks').innerHTML='Year 2010';", 1e3); n(j) }; k.onclick = function () { b = e; setTimeout("document.getElementById('year_no_tracks').innerHTML='Year 2009';", 1e3); n(k) }; l.onclick = function () { b = d; setTimeout("document.getElementById('year_no_tracks').innerHTML='Year 2008';", 1e3); n(l) }; m.onclick = function () { b = c; setTimeout("document.getElementById('year_no_tracks').innerHTML='Year 2007';", 1e3); n(m) }; n(i)
} function draw_map(a) {
var b = null; var c = google.visualization .arrayToDataTable([ ["Country", "Teams"], ["Australia", 1], ["China", 30], ["India", 4], ["Indonesia", 1], ["Japan", 12], ["Korea", 4], ["Taiwan", 4], ["Congo", 1], ["Belgium", 1], ["Denmark", 2], ["France", 4], ["Germany", 10], ["Israel", 1], ["Italy", 2], ["Netherlands", 7], ["Norway", 1], ["Poland", 1], ["Scotland", 2], ["Slovenia", 1], ["Spain", 3], ["Sweden", 2], ["Switzerland", 2], ["Turkey", 3], ["United Kingdom", 7], ["Argentina", 1], ["Brazil", 1], ["Chile", 1], ["Colombia", 1], ["Costa Rica", 1], ["Panama", 3], ["Mexico", 8], ["United States", 56], ["Canada", 11] ]); var d = google.visualization .arrayToDataTable([ ["Country", "Teams"], ["Australia", 2], ["China", 21], ["India", 3], ["Japan", 9], ["Korea", 4], ["Taiwan", 2], ["Belgium", 2], ["Denmark", 3], ["France", 5], ["Germany", 5], ["Italy", 2], ["Netherlands", 4], ["Norway", 1], ["Poland", 1], ["Scotland", 3], ["Spain", 3], ["Sweden", 1], ["Switzerland", 1], ["Turkey", 4], ["United Kingdom", 5], ["Brazil", 1], ["Colombia", 1], ["Panama", 2], ["Mexico", 3], ["United States", 43], ["Canada", 10], ["South Africa", 1], ["Hungary", 1] ]); var e = google.visualization .arrayToDataTable([ ["Country", "Teams"], ["Australia", 3], ["China", 11], ["India", 3], ["Japan", 9], ["Korea", 3], ["Taiwan", 2], ["Belgium", 1], ["Denmark", 2], ["France", 3], ["Germany", 8], ["Italy", 1], ["Netherlands", 2], ["Poland", 1], ["Scotland", 1], ["Slovenia", 1], ["Spain", 2], ["Sweden", 2], ["Switzerland", 2], ["Turkey", 2], ["United Kingdom", 8], ["Panama", 1], ["Mexico", 3], ["United States", 36], ["Canada", 7], ["South Africa", 1], ["Hungary", 1] ]); var f = google.visualization .arrayToDataTable([ ["Country", "Teams"], ["Australia", 2], ["China", 9], ["India", 4], ["Japan", 6], ["Korea", 2], ["Taiwan", 2], ["Belgium", 2], ["Denmark", 2], ["France", 2], ["Germany", 4], ["Italy", 2], ["Netherlands", 2], ["Poland", 1], ["Scotland", 1], ["Slovenia", 1], ["Spain", 2], ["Sweden", 2], ["Switzerland", 1], ["Turkey", 1], ["United Kingdom", 8], ["Brazil", 1], ["Colombia", 2], ["Mexico", 2], ["United States", 30], ["Canada", 10], ["Singapore", 1] ]); var g = google.visualization .arrayToDataTable([ ["Country", "Teams"], ["Australia", 1], ["China", 9], ["India", 1], ["Japan", 3], ["Belgium", 1], ["France", 2], ["Germany", 2], ["Italy", 2], ["Netherlands", 2], ["Poland", 1], ["Scotland", 1], ["Slovenia", 1], ["Spain", 1], ["Switzerland", 2], ["Turkey", 2], ["United Kingdom", 5], ["Colombia", 1], ["Mexico", 2], ["United States", 28], ["Canada", 10], ["Singapore", 1] ]); var h = google.visualization .arrayToDataTable([ ["Country", "Teams"], ["Australia", 1], ["China", 5], ["India", 1], ["Japan", 2], ["Italy", 2], ["Scotland", 1], ["Slovenia", 1], ["Turkey", 1], ["Colombia", 1], ["Mexico", 1], ["United States", 25], ["Canada", 6] ]); var i = google.visualization .arrayToDataTable([ ["Country", "Teams"], ["India", 1], ["Japan", 2], ["Korea", 1], ["Germany", 1], ["Scotland", 1], ["Slovenia", 1], ["Switzerland", 1], ["Turkey", 1], ["United Kingdom", 2], ["Colombia", 1], ["Mexico", 1], ["United States", 23], ["Canada", 3] ]); var j = google.visualization .arrayToDataTable([ ["Country", "Teams"], ["Switzerland", 1], ["United Kingdom", 1], ["United States", 10], ["Canada", 1] ]); var k = google.visualization .arrayToDataTable([ ["Country", "Teams"], ["United States", 5] ]); var l = { legend: { textStyle: { color: "black", fontSize: 16 } }, datalessRegionColor: "#eeeeee", backgroundColor: { fill: "none" }, colorAxis: { minValue: 0, maxValue: 56, colors: ["green", "yellow", "magenta", "red"] }, width: 994, height: 700 }; var m = new google.visualization .GeoChart(document.getElementById("visualization")); if (a == 2012) b = c; else if (a == 2011) b = d; else if (a == 2010) b = e; else if (a == 2009) b = f; else if (a == 2008) b = g; else if (a == 2007) b = h; else if (a == 2006) b = i; else if (a == 2005) b = j; else if (a == 2004) b = k; if (prev_year_num != a) { if (prev_year_num != 0) { $("#visualization").fadeOut("slow", function () { m.draw(b, l); document.getElementById("year_no") .innerHTML = "Year " + a; prev_year_num = a; $("#visualization").fadeIn("slow") }) } else { m.draw(b, l); document.getElementById("year_no") .innerHTML = "Year " + a; prev_year_num = a } }
} var prev_year_num = 0; google.load("visualization", "1", {
packages: ["geochart"]
}); google.load("visualization", "1", {
packages: ["corechart"]
}); $(document).ready(function () {
draw_map(2012); init_tracks_graph()
})