甜甜圈内心文字

Question

我使用高图库开发了一个圆环图。我需要在甜甜圈的内部加一个标签。

预期结果：

JS：

$(function () {
    $('#container8').highcharts({
        chart: {
            type: 'pie',
            options3d: {
                enabled: false,
                alpha: 0
            }
        },
        colors: ['#081969', '#0e2569', '#1e3b81', '#284893', '#30509b'],
        title: {
            text: ''
        },tooltip: {
            enabled: false
        },
        plotOptions: {
            pie: {
                innerSize: 140,
                depth: 45
            }
        },
        series: [{
            name: 'Delivered amount',
            data: [
                ['56%', 56],
                ['44%', 44]
            ]
        }]
    });
});

可以在这里找到小提琴：http://jsfiddle.net/ak9jK/

Answer 1

title: {
        style: {
            fontSize: '48px',
            fontWeight: 'bold'
        },
        verticalAlign: 'middle'
    },

最后

},

function (chart) {
    chart.setTitle({
        text: chart.series[0].data[0].y + '%'
    });
});

DEMO ：http://jsfiddle.net/ak9jK/1/

相关问题：
Highcharts Donut Chart text in center change on hover
Place text in center of pie chart - Highcharts

Answer 2

您可以使用Renderer来添加自定义文字。