Question

我正在修改图表标签上的字体，但似乎有一些笔划应用于某些标签而不是其他标签。

我已将图表分解为非常小的版本，并且笔划仍在那里。什么导致笔画出现以及如何关闭所有标签？

$(function () {

Highcharts.theme = {
    colors:  [
  '#94B8D2',
  '#2a71a5',
  '#A699B9',
  '#4D3474',
  '#CDAED1',
  '#82368C',
  '#AAAEB2',
  '#565E65',
  '#EF92A5',
  '#DF264C',
  '#FFBA9D',
  '#FF763B',
  '#95FEDB',
  '#27CAE1',
  '#EAEAA1',
  '#D5D644',
  ]
};

// Apply the theme
Highcharts.setOptions(Highcharts.theme);

    var donutData = [
      ['K01',6243],
      ['K05',1788],
      ['K07',8745],
      ['K08',16018],
      ['K12',11647],
      ['K18',0],
      ['K22',4482],
      ['K23',5166],
      ['K24',2922],
      ['K25',2103],
      ['K99',8410],  
    ];

    Highcharts.chart('StrokeProblem', {
        title: {
            text: "Bizarre Label Strokes",
            align: 'center',
            verticalAlign: 'middle',           
        },
        series: [{
            type: 'pie',
            name: 'Stroke',
            innerSize: '75%',
            data: donutData,
        }],
        plotOptions: {
            pie: {
                dataLabels: {
                        style: { fontSize: '17px' },
                    formatter: function(label){
                      label.color = this.color;
                            return this.point.name;
                    },
                }
            }
        },
    });
});

以下是相关的JSFiddle。

Answer 1

Highcharts会自动为具有浅色字体颜色的标签添加文本阴影。您可以使用textOutline属性禁用它：

dataLabels: {
 style: {
  fontSize: '17px',
  textOutline: false
 },
}

Highcharts在饼图标签上随机出现奇怪的笔触

1 个答案: