Question

我有以下饼图：http://jsfiddle.net/wjqrh/76/

    new Highcharts.Chart({
        chart: {
            renderTo: 'f-chart-container',
            type: 'pie',
            backgroundColor: 'rgba(255, 255, 255, 0)'
        },
        title: {
            text: ''
        },
        plotOptions: {
            pie: {
                shadow: true,
                dataLabels: {
                    formatter: function () {
                        return '<span style="color: ' + this.point.color + '; font-weight: bold; font-size: 115%">'
                            + this.point.percentage.toFixed(1)
                            + '%</span>';
                    },
                    distance: 3,
                    connectorWidth: 0,
                    x: 0,
                    y: 0
                }
            }
        },
        tooltip: {
            formatter: function () {
                return '<b>' + this.point.name + '</b>: '
                    + this.point.y
            }
        },
        series: [
            {
                name: '',
                data: data,
                size: '73%',
                innerSize: '50%',
                showInLegend: false
            }
        ],
        colors: colors
    });

紫色部门的标签放在正确的位置，但我想把它放在中间位置，就像显示第三个（绿色）扇区的标签一样。橙色和青色部门正在发生相同的标签定位事件。

如何强制将标签放在扇区的中心？

Answer 1

只有我想到的是使用translate（）函数，它允许移动SVG元素。

http://jsfiddle.net/wjqrh/77/

chart.series[0].data[5].dataLabel.translate(275,520);

以饼图为中心标签。 Highcharts

1 个答案: