Skip to content

Instantly share code, notes, and snippets.

@s5ot

s5ot/gist:8970149

Created February 13, 2014 05:19
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save s5ot/8970149 to your computer and use it in GitHub Desktop.
Save s5ot/8970149 to your computer and use it in GitHub Desktop.
Download ZIP
Flot bar chart sample
Raw
gistfile1.js
<html>
<head>
<meta charset="UTF-8">
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script language="javascript" type="text/javascript" src="flot-flot-e2147c0/jquery.flot.js"></script>
<script language="javascript" type="text/javascript" src="flot-flot-e2147c0/jquery.flot.categories.js"></script>
</head>
<body>
<h1>Weather Statistics in Boston</h1>
<div id="placeholder" style="width:600px;height:300px"></div>
<script>
var $ = jQuery.noConflict();
$(document).ready(function(){
// Declare the variable
var misassignments_per_decile = [
['Oct', 0.1],
['Nov', 0.6],
['Dec', 12],
['Jan', 14.9],
['Feb', 11.8],
['Mar', 7],
['Apr', 0.3]
];
// plot the data
$.plot($("#placeholder"), [
{
label: "",
data: misassignments_per_decile }],
{
series: {
bars: {
show: true,
barWidth: 0.6,
align: "center"
}
},
xaxis: {
show: true,
mode: "categories",
tickLength: 0,
position: 'bottom',
transform: function (v) { return v; },
},
yaxis: {
show: true,
ticks: 8,
min: 0,
max: 15
}
}
);
}); //end of $(document).ready(function()
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment