javascript - Highcharts中的DataLabel在容器外部/未显示

我正在绘制一个半圆饼图(使用innersize和start- / endAngle)。但是我的数据标签在绘图区域之外(在中心点/ xAxis下方)或完全不显示我的设置。

$(function () {
    var chart;
    $(document).ready(function() {
        chart = new Highcharts.Chart({
            chart: {
                renderTo: 'container',
                plotBackgroundColor: null,
                plotBorderWidth: null,
                plotShadow: false
            },
            title: {
                text: '',
                enabled: false
            },
            tooltip: {
                pointFormat: '{series.name}: <b>{point.percentage}%</b>',
                percentageDecimals: 1
            },
            plotOptions: {
                pie: {
                    startAngle: -90,
                    endAngle: 90,
                    center: ['50%', '100%'],
                    size: '140%',
                    cursor: 'pointer',
                    dataLabels: {
                        enabled: true,
                        //crop: false,
                        //overflow: 'none',
                        //useHTML: true,
                        formatter: function() {
                            return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %';
                        },
                        style: {
                            width: '100px' // for line wrap on long dataLabels
                        }
                    }
                }
            },
  series: [{
            type: 'pie',
            name: 'Browser share',
            data: [
                ['Firefox and this is very very very long name with some spaces etc.',   45.0],
                ['IE',       26.8],
                {
                    name: 'Chrome',
                    y: 12.8,
                    sliced: true,
                    selected: true
                },
                ['Safari',    8.5],
                ['Opera',     6.2],
                ['Others',   0.7]
            ]
        }]
        });
    });

});

看到这里:jsfiddle

使用useHTML:true, useHTML: true完全无效。

使用useHTML: true将在图表内渲染溢出的dataLabels，但是我的长dataLabels消失了。

因此，在考虑以下几点的情况下如何实现此目的？

我的半甜甜圈应该总是在我的情节区域的底部并使用
空间(不能太小)。

碰巧我的数据标签很长，因此定义style.width似乎需要换行。

DataLabels应该始终位于xAxis之上，而不能低于我的半甜甜圈的底部。

DataLabels应该始终显示，并且使用连接器在图表之外。

在此先感谢您，并致以最诚挚的问候。

最佳答案

看起来可能是错误，在这里报告:https://github.com/highslide-software/highcharts.com/issues/2630