Highcharts test tool
by Torstein Hønsi
HTML
<script src="http://code.highcharts.com/highcharts.src.js"></script>
<div id="container" style="height: 300px; min-width: 600px"></div>
<button id="settitle">Set title (Pie 1)</button>
<button id="update">Update (Pie 2)</button>
JavaScript
/**
* Pie title plugin
* Author: Torstein Hønsi
* Original: http://jsfiddle.net/highcharts/tnSRA/
* Last revision: 2015-08-31
*/
(function (Highcharts) {
Highcharts.seriesTypes.pie.prototype.setTitle = function (titleOption) {
var chart = this.chart,
center = this.center || (this.yAxis && this.yAxis.center),
labelBox,
box,
format;
if (center && titleOption) {
box = {
x: chart.plotLeft + center[0] - 0.5 * center[2],
y: chart.plotTop + center[1] - 0.5 * center[2],
width: center[2],
height: center[2]
};
format = titleOption.text || titleOption.format;
format = Highcharts.format(format, this);
if (this.title) {
this.title.attr({
text: format
});
} else {
this.title = this.chart.renderer.label(format)
.css(titleOption.style)
.add()
}
labelBBox = this.title.getBBox();
titleOption.width = labelBBox.width;
titleOption.height = labelBBox.height;
this.title.align(titleOption, null, box);
}
};
Highcharts.wrap(Highcharts.seriesTypes.pie.prototype, 'render', function (proceed) {
proceed.call(this);
this.setTitle(this.options.title);
});
} (Highcharts));
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container',
type: 'pie'
},
title: {
text: 'Highcharts pie title plugin'
},
xAxis: {
categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']
},
plotOptions: {
pie: {
dataLabels: {
enabled: false
},
size: '75%'
}
},
series: [{
data:...