Bar Highchart中的多色数据标签

Question

我基本上需要在图表上格式化数据值，代表两个不同的数据集。我想用不同的颜色来展示它们。这是我在高图

的图表选项中所做的

plotOptions: {
            bar: {
                dataLabels: {
                    enabled: true,
                     formatter: function() {
                        return '<div class="orange">'+ this.y +' % '+ '</div> | '+
                            '<div class="brown">'+ this.point.name + ' % </div>';
                    }
                },
                pointWidth: 22
            }
        }

我看到两个值但是颜色保持不变。

有任何线索如何实现这一目标？

Answer 1

来自documentation：

  

支持HTML的子集。解析工具提示的HTML   转换为SVG，因此这不是一个完整的HTML渲染器。该   支持以下选项卡：,,,,
，。   Spans可以使用style属性设置样式，但只能使用与文本相关的CSS   与SVG共享的内容已经处理完毕。

虽然这是在讨论toolTip.formatter，但它仍然适用于dataLabel.formatter。

Answer 2

是的，你可以获得多彩的数据标签。

Highcharts接受格式化程序中的HTML，然后将其转换为svg，然后将其放在span元素中。

让你的东西设置为useHTML: true

这将在格式化程序中呈现您的html。如果你没有设置它，它将不会将HTML部分作为HTML。它只是渲染html标签内提到的东西。

希望使用useHTML解决您的问题。