ElementStacks
HTML
<script src="http://highcharts.com/js/testing.js"></script>
<div id="container" style="height:250px;width:400px;float:left;"></div>
<div id="container2" style="height:250px;width:200px;float:left;"></div>
JavaScript
var chart = new Highcharts.Chart({
chart: {
renderTo:'container',
defaultSeriesType:'bar'
},
title:{
text:'Safety Rating'
},
legend:{
enabled:false,
},
credits:{
enabled:false,
},
tooltip: {
formatter: function() {
return this.y;
}
},
xAxis: {
categories:['car one','car two','car three','car four','car five'],
labels:{
style:{
fontWeight:'bold'
}
},
title:{
text:null
}
},
yAxis: {
title:{
text:null,
}
},
plotOptions: {
series:{
shadow:false,
borderWidth:0,
pointPadding:.2,
groupPadding:0
}
},
series: [{
color:'#36c',
data: [90,80,75,50,30]
}]
});
//-----------------------------------------
var chart = new Highcharts.Chart({
chart: {
renderTo:'container2',
backgroundColor:'#eee',
defaultSeriesType:'bar',
marginLeft:20
},
title:{
text:'Number of Tests'
},
legend:{
enabled:false,
},
credits:{
enabled:false,
},
tooltip: {
formatter: function() {
return this.y;
}
},
xAxis: {
categories:['cat one','cat two','cat three','cat four','cat five'],
labels:{
enabled:false
},
title:{
text:null
}
},
yAxis: {
title:{
text:null,
}
},
plotOptions: {
series:{
shadow:false,
borderWidth:0,
pointPadding:.2,
groupPadding:0
}
},
series: [{
color:'#999',
data: [20,10,35,17,12]
}]
});