ONA 16 Board - Members - Nationality
by Adam Nekola
HTML
<script src="https://code.highcharts.com/highcharts.js"></script>
<div id="container" style="min-width: 310px; height: 350px; margin: 0 auto"></div>
JavaScript
$(function () {
Highcharts.setOptions({
lang: {
thousandsSep: ","
}
});
Highcharts.chart('container', {
title: {
text: 'Membership by Nationality',
align: 'left',
style: {
fontWeight: 800,
fontSize: "2em"
}
},
series: [{
name: 'Gender',
data: [{
name: 'United States',
y: 2073
}, {
name: 'International',
y: 306
}, {
name: 'Not reported',
y: 225
}]
}],
xAxis: {
categories: [
'Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'
],
tickLength: 0,
lineColor: "#eeeeee"
},
yAxis: {
min: 0,
max: 3000,
endOnTick: false,
title: {
text: 'Followers',
align: "low"
}
},
chart: {
type: 'pie',
style: {
fontFamily: "\"Source Sans Pro\", Verdana, Arial, Helvetica, sans-serif"
}
},
plotOptions: {
column: {
pointPadding: 0,
borderWidth: 0
},
series: {
stacking: "normal",
marker: false
},
pie: {
dataLabels: {
enabled: true,
format: '<span style="font-weight:600;">{point.name}</span>: {point.percentage:.1f} %',
style: {
color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black',
fontSize: "1.1em",
fontWeight: 100
}
}
}
},
colors: ["#63bad6",'#213563', "#ddd",...