Question

我有一个多系列高图和一个共享工具提示，我试图设置一系列与其系列颜色不同的工具提示边框颜色。如果我在全局工具提示对象上设置它，它会将颜色设置为所有系列。所以我尝试在系列级别设置工具提示边框颜色，并且看起来颜色属性不会从全局工具提示组件继承到系列级别。需要帮助。

在下面附上我的jsfiddle -

在小提琴中，我选择不设置工具提示颜色，以便highcharts将工具提示的边框颜色设置为系列颜色。但我真正需要的是蓝色系列的工具提示边框颜色为红色。这可以完成吗？

JSFiddle - http://jsfiddle.net/arj_ary/5yjhfh9x/

全局工具提示组件

  tooltip: {
              shared: true,
              useHTML: true,
              crosshairs: {width:1, color:COLORS.gray_1, zIndex:3},
              borderColor: COLORS.black, //setting here would set it to black for both the series
              borderWidth: 1,
              borderRadius: 0,
              backgroundColor: 'rgba(255, 255, 255, .85)'
          }

系列级：

series.push({
                    type: 'spline',
                    color: COLORS.red_3,
                    data: [],
                    marker: {
                        enabled: false,
                        states: {
                            hover: {
                                enabled: false
                            }
                        }
                    },
                    lineWidth: 0,
                    states: {
                        hover: {
                            enabled: false,
                            lineWidth: ChartSize[this.size].lineWidth,
                            halo: null
                        }
                    },

                    tooltip: {
                        trackByArea:true,
                        shared: false,
                        useHTML: true,
                        borderColor: COLORS.red_3, //setting here does not work since we have a global tooltip color defined above.
                        borderWidth: 1,
                        crosshairs: {width:1, color:COLORS.gray_1, zIndex:3}
                    },

                    name: "series1",
                    zIndex: 3
                });

编辑： -

尝试下面的共享工具提示的代码，还没有让它工作（它仍然将属性设置为所有系列，而不仅仅是我的情况下所需的series1）

  HC.wrap(Highcharts.Tooltip.prototype, 'refresh', function(p, point, mouseEvent) {
        p.call(this, point, mouseEvent);

        if (point && point.length > 0 && point[0].series.name === 'series1') {
            var pointTooltipBorderColor = point && point.length > 0 &&  point[0].options.tooltip && point[0].options.tooltip.borderColor,
            seriesTooltipBorderColor = point && point.length > 0 && point[0].series && point[0].series.options.tooltip && point[0].series.options.tooltip.borderColor,
            borderColor = pointTooltipBorderColor || seriesTooltipBorderColor,
            label = this.label;

            if (label && borderColor) {
            label.attr({
                stroke: borderColor
            });
            }
        }
    })

使Highcharts'共享'工具提示颜色与系列颜色不同

0 个答案: