javascript - 修复了 Highcharts 系列数据标签中的数据标签尺寸

Question

我愿意实现以下目标:

我的 highcharts 图表有这个系列，每个点都附加了数据标签，如下例所示: http://jsfiddle.net/sbochan/p6Ufv/

数据标签应该是红色圆圈(完美的圆圈)，因此我对它们使用了以下定义:

series{
//......////
dataLabels:{
        enabled : true,
        backgroundColor: 'rgb(229, 32, 32)',
        borderRadius:24,
        borderWidth:2,
        borderColor: '#890000',
        color:'#FFF',
        shadow:true,
        defer:false,
        padding: 3,
 }

当点数据是 2 位数字时，下面给出了一个带有一些笔划的漂亮红色圆圈。问题出在 1 位或 2 位以上的数字上。由于某种原因，highcharts 从数据标签内容中导出 Rect SVG 尺寸。这一事实导致数据标签在我的设计中变得不一致。出于某种原因，我找不到一种方法来强制 highcharts 在系列数据标签的情况下使用 circle 而不是 rect，或者强制它根据符合我的尺寸规范。

这可能吗？有办法解决吗？提前致谢。

Answer 1

我为我的问题找到了一个创造性的解决方案。我创建了一个圆形图像(也可以使用 SVG)，并将其用作该系列中的标记。这使得我的系列(也是一个散点系列)由许多圆圈组成。然后，我使用了一些数据标签属性，例如 padding 和 style 来使它们看起来像我想要的那样。我最后一件事是使用格式化程序来设置正确的数据。