Created
July 30, 2014 02:26
-
-
Save arthurwuhoo/b856342eec904e42c642 to your computer and use it in GitHub Desktop.
My Chart
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype HTML> | |
<meta charset = 'utf-8'> | |
<html> | |
<head> | |
<link rel='stylesheet' href='http://nvd3.org/assets/css/nv.d3.css'> | |
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'></script> | |
<script src='http://d3js.org/d3.v3.min.js' type='text/javascript'></script> | |
<script src='http://timelyportfolio.github.io/rCharts_nvd3_tests/libraries/widgets/nvd3/js/nv.d3.min-new.js' type='text/javascript'></script> | |
<script src='http://nvd3.org/assets/lib/fisheye.js' type='text/javascript'></script> | |
<style> | |
.rChart { | |
display: block; | |
margin-left: auto; | |
margin-right: auto; | |
width: 800px; | |
height: 400px; | |
} | |
</style> | |
</head> | |
<body > | |
<div id = 'chartc46c608e624c' class = 'rChart nvd3'></div> | |
<script type='text/javascript'> | |
$(document).ready(function(){ | |
drawchartc46c608e624c() | |
}); | |
function drawchartc46c608e624c(){ | |
var opts = { | |
"dom": "chartc46c608e624c", | |
"width": 800, | |
"height": 400, | |
"x": "semester", | |
"y": "number", | |
"group": "class", | |
"type": "multiBarChart", | |
"id": "chartc46c608e624c" | |
}, | |
data = [ | |
{ | |
"semester": 1, | |
"number": 1110, | |
"class": 1, | |
"name": "CS 1110: Introduction to Programming", | |
"dept": "CS" | |
}, | |
{ | |
"semester": 1, | |
"number": 1800, | |
"class": 2, | |
"name": "COMM 1800: Making Business Work", | |
"dept": "COMM" | |
}, | |
{ | |
"semester": 1, | |
"number": 3220, | |
"class": 3, | |
"name": "STAT 3220: Regression Analysis", | |
"dept": "STAT" | |
}, | |
{ | |
"semester": 1, | |
"number": 3250, | |
"class": 4, | |
"name": "MATH 3250: Ordinary Differential Equations", | |
"dept": "MATH" | |
}, | |
{ | |
"semester": 1, | |
"number": 2600, | |
"class": 5, | |
"name": "PSYC 2600: SOcial Psychology", | |
"dept": "PSYC" | |
}, | |
{ | |
"semester": 2, | |
"number": 2490, | |
"class": 1, | |
"name": "ANTH 2590: Anthropology of Business", | |
"dept": "ANTH" | |
}, | |
{ | |
"semester": 2, | |
"number": 2470, | |
"class": 2, | |
"name": "SOC 2470: American Society & Pop Culture", | |
"dept": "SOC" | |
}, | |
{ | |
"semester": 2, | |
"number": 3100, | |
"class": 3, | |
"name": "MATH 3100: Probability", | |
"dept": "MATH" | |
}, | |
{ | |
"semester": 2, | |
"number": 2630, | |
"class": 4, | |
"name": "RELG 2630: Business, Ethics, and Society", | |
"dept": "RELG" | |
}, | |
{ | |
"semester": 2, | |
"number": 2010, | |
"class": 5, | |
"name": "COMM 2010: Financial Accounting", | |
"dept": "COMM" | |
}, | |
{ | |
"semester": 3, | |
"number": 3080, | |
"class": 1, | |
"name": "STAT 3080: Case Studies in Statistics", | |
"dept": "STAT" | |
}, | |
{ | |
"semester": 3, | |
"number": 3810, | |
"class": 2, | |
"name": "COMM 3810: Business Ethics", | |
"dept": "COMM" | |
}, | |
{ | |
"semester": 3, | |
"number": 2020, | |
"class": 3, | |
"name": "COMM 2020: Managerial Accounting", | |
"dept": "COMM" | |
}, | |
{ | |
"semester": 3, | |
"number": 5410, | |
"class": 4, | |
"name": "STAT 5410: Statistical Software", | |
"dept": "STAT" | |
}, | |
{ | |
"semester": 3, | |
"number": 5559, | |
"class": 5, | |
"name": "STAT 5559: Computing with SAS", | |
"dept": "STAT" | |
}, | |
{ | |
"semester": 4, | |
"number": 3880, | |
"class": 1, | |
"name": "COMM 3880: Global Sustainability", | |
"dept": "COMM" | |
}, | |
{ | |
"semester": 4, | |
"number": 3410, | |
"class": 2, | |
"name": "COMM 3410: Commercial Law", | |
"dept": "COMM" | |
}, | |
{ | |
"semester": 4, | |
"number": 4520, | |
"class": 3, | |
"name": "COMM 4520: Advanced Topics in IT", | |
"dept": "COMM" | |
}, | |
{ | |
"semester": 4, | |
"number": 4240, | |
"class": 4, | |
"name": "COMM 4240: eCommerce and Web Analytics", | |
"dept": "COMM" | |
}, | |
{ | |
"semester": 4, | |
"number": 4993, | |
"class": 5, | |
"name": "STAT 4993: Independent Study in Statistics", | |
"dept": "STAT" | |
} | |
] | |
if(!(opts.type==="pieChart" || opts.type==="sparklinePlus" || opts.type==="bulletChart")) { | |
var data = d3.nest() | |
.key(function(d){ | |
//return opts.group === undefined ? 'main' : d[opts.group] | |
//instead of main would think a better default is opts.x | |
return opts.group === undefined ? opts.y : d[opts.group]; | |
}) | |
.entries(data); | |
} | |
if (opts.disabled != undefined){ | |
data.map(function(d, i){ | |
d.disabled = opts.disabled[i] | |
}) | |
} | |
nv.addGraph(function() { | |
var chart = nv.models[opts.type]() | |
.width(opts.width) | |
.height(opts.height) | |
if (opts.type != "bulletChart"){ | |
chart | |
.x(function(d) { return d[opts.x] }) | |
.y(function(d) { return d[opts.y] }) | |
} | |
chart | |
.tooltipContent( function(key, x, y, e){ | |
return '<b>Semester: </b> ' + e.point.semester + '<br/>' + | |
'<b>Course: </b>' + e.point.name | |
} ) | |
.forceY([ 0, 6000 ]) | |
.color([ "#6B0C22", "#D9042B", "#F4CB89", "#588C8C", "#011C26" ]) | |
chart.yAxis | |
.tickFormat( function(d) {return '' + d} ) | |
d3.select("#" + opts.id) | |
.append('svg') | |
.datum(data) | |
.transition().duration(500) | |
.call(chart); | |
nv.utils.windowResize(chart.update); | |
return chart; | |
}); | |
}; | |
</script> | |
<script></script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment