Highcharts Demo
author(s): Torstein Hønsi
by Jaak Kütt
HTML
<script src="http://code.highcharts.com/highcharts.js"></script>
<div id="content" style="display:none;"></div>
<div id="container" style="height: 400px"></div>
JavaScript
$(function () {
Highcharts.theme = {
colors: ['#242c4a'],
chart: {
width: 350,
backgroundColor: {
linearGradient: [0, 0, 500, 500],
stops: [
[0, 'rgb(255, 255, 255)'],
[1, 'rgb(240, 240, 255)']
]
},
},
};
// Apply the theme
Highcharts.setOptions(Highcharts.theme);
// Build the chart
$('#container').highcharts({
chart: {
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
title: {
text: 'Our Projects'
},
plotOptions: {
pie: {
borderColor: '#48588c',
borderWidth: 7,
slicedOffset: 20,
allowPointSelect: true,
cursor: 'pointer',
dataLabels: {
enabled: false
}
},
series: {
allowPointSelect : true,
slicedOffset: 15,
states: {
select: {
color: '#fefe0f',
borderWidth: 10,
borderColor: '#fefe0f',
zIndex:10
},
hover: {
enabled: false
}
},
events: {
mouseOut: function () {
var serie = this.points;
$.each(serie, function (i, e) {
if (!this.selected) {
this.graphic.attr({
fill: '#242c4a'
});
} else {
...