-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathBarGraphHDIregion.html
41 lines (37 loc) · 1.63 KB
/
BarGraphHDIregion.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<script type='text/javascript'>//<![CDATA[
var dataValues =[0.76500000000000001, 0.82199999999999995, 0.73199999999999998, 0.77300000000000002, 0.91100000000000003, 0.626, 0.51000000000000001]
;
var dataValues2 =
[0.72799999999999998, 0.80700000000000005, 0.70999999999999996, 0.69599999999999995, 0.90200000000000002, 0.53300000000000003, 0.44800000000000001]
;
var categories =
['East Asia & Pacific (all income levels)', 'Europe & Central Asia (all income levels)', 'Latin America & Caribbean (all income levels)', 'Middle East & North Africa (all income levels)', 'North America', 'South Asia', 'Sub-Saharan Africa (all income levels)']
;
// Define the variables
var title="Human Development Index by gender, 2013";
var c1="rgba(165,170,217,1)";
var c2="rgba(126,86,134,.9)";
var serie1="Men";
var serie2="Women";
</script>
<html><head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Highcharts with variable Column - by ThomasRoca</title>
<script type='text/javascript' src='//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>
<script type='text/javascript'>
$(function () {
$('#container').highcharts({
chart: {type: 'column'},
plotOptions: {column: {grouping:false,shadow:false,borderWidth: 0} },
title: { text:title },
xAxis: {categories: categories },
series: [{ name: serie1, color: c1, data: dataValues,pointPadding: 0.3 },
{name: serie2, color: c2, data: dataValues2,pointPadding: 0.4 }
]
});
});
//]]>
</script></head>
<body><script src="http://code.highcharts.com/highcharts.js"></script>
<div id="container" style="height: 400px"></div>
</body></html>