HTML
<script type="text/javascript" src="http://code.highcharts.com/highcharts.js"></script>
<div id="container" style="height: 300px"></div>
<pre id="data.csv" style="display: none">Year,MB_REF_count,REF_regionAVG,REF_regionAVG_cum-rel-1970
1957,10,-130,3533
1958,10,-896,2637
1959,11,-445,2192
1960,14,-555,1637
1961,15,-394,1243
1962,20,-238,1005
1963,23,-361,644
1964,23,229,873
1965,25,100,973
1966,28,-222,751
1967,30,-29,722
1968,32,-102,620
1969,32,-420,200
1970,33,-200,0
1971,33,-171,-171
1972,33,-214,-385
1973,33,-102,-487
1974,33,-319,-806
1975,34,-104,-910
1976,36,-112,-1022
1977,38,-327,-1349
1978,38,-234,-1583
1979,38,-419,-2002
1980,37,-117,-2119
1981,36,-180,-2299
1982,37,-461,-2760
1983,39,156,-2604
1984,40,-224,-2828
1985,40,-248,-3076
1986,40,-520,-3596
1987,40,188,-3408
1988,40,-45,-3453
1989,40,-257,-3710
1990,40,-409,-4119
1991,40,-459,-4578
1992,39,-116,-4694
1993,40,-216,-4910
1994,40,-671,-5581
1995,40,-413,-5994
1996,40,-408,-6402
1997,40,-721,-7123
1998,40,-535,-7658
1999,40,-663,-8321
2000,40,-181,-8502
2001,40,-213,-8715
2002,40,-429,-9144
2003,40,-545,-9689
2004,40,-586,-10275
2005,40,-606,-10881
2006,40,-779,-11660
2007,40,-670,-12330
2008,39,-457,-12787
2009,39,-429,-13216
2010,40,-702,-13918
2011,40,-893,-14811
2012,39,-812,-15623
2013,33,-842,-16465
2014,22,-865,-17330</pre>
JavaScript
$(document).ready(function() {
Highcharts.setOptions({
lang: {
numericSymbols: [" 000", " 000 000"]
}
});
var options = {
chart: {
renderTo: 'container',
defaultSeriesType: 'spline'
},
title: {
text: "Change in Glacier Mass",
align: "center",
y: 20,
x: 0,
style: {
fontSize: "28px",
color: (Highcharts.theme && Highcharts.theme.textColor) || "black"
}
},
subtitle: {
text: "xxx",
align: "center",
x: -40,
style: {
fontSize: "13px",
color: "#666666"
}
},
xAxis: {
labels: {
style: {
color: "#666666"
},
x: 0
},
gridLineWidth: 1,
gridLineDashStyle: 'Dot',
tickWidth: 0
},
yAxis: {
title: {
text: "Cumulative mean<br />annual mass balance<br />(mm w.e.)",
align: "high",
rotation: 0,
x: 180,
y: -30,
useHTML: true,
style: {
align: "center",
fontWeight: "bold"
}
},
gridLineWidth: 1,
gridLineDashStyle: 'Dot',
min: -25000,
max: 5000,
tickInterval: 5000
},
credits: {
href: "",
text: "",
position: {
x: -185
},
style: {
fontSize: "8px",
color: "#666666"
}
},
legend: {
enabled: false,
layout: "vertical",
align: "right",
verticalAlign: "top",
y: 55,
itemStyle: {
color: '#777',
fontWeight: 'normal',
fontSize: '12px'
}
},
plotOptions: {
series: {
connectNulls: false,
shadow: false,
lineWidth: 2,
color: '#3f9aff',
marker: {
enabled: false
}
}
},
series: [{
name: 'Cumulative mass balance (m w.e.)',
data: []
}],
exporting: {
buttons: {
contextButton: {
symbol:...