Question

我有一个堆积条形图，我在图表加载后应用自定义边框，即

},function(chart){
    chart.series[1].data[0].graphic.attr({'stroke':'yellow','stroke-width': 2})
    chart.series[1].data[1].graphic.attr({'stroke':'yellow','stroke-width': 2})

这种方法很好，除了左边界笔划没有显示全宽，即

这些是我的plotOptions：

    plotOptions: {
        series: {           
            states: {
                hover: {
                    enabled: false
                    }
            },          
            stacking: 'normal',
            pointPadding: 0.1,
            borderWidth: 0,
            lineWidth: 0,   
            dataLabels: {
                enabled: true,
                formatter: function() { return this.series.index==0 ? "<div style='color:#000000;'>"+this.y + "</div>" : this.y ; },
                useHTML: true,
                connectorWidth: 1,
                style: {
                    fontSize: "14px",
                    color: '#FFFFFF',
                    fontWeight: 'normal'
                }
            }
        }
    },

此外，即使我已禁用悬停效果（如上面的plotOptions中所示），当您将鼠标悬停在突出显示的栏上时，黄色边框会变为白色：

HOVERING之后

任何有关解决其中任何一个问题的建议都将不胜感激。

Answer 1

已修复 - 悬停问题 我能够使用plotOptions：{series：{enableMouseTracking：false}}}来禁用所有鼠标交互。这解决了将边框变回白色的悬停效果。

如果您需要保留鼠标交互，只需启用默认边框颜色即突出显示，即plotOptions：{bar：{borderColor：＆＃34; yellow＆＃34;}}

Answer 2

FIXED - 堆积图表上的SVG边框问题 这有点像黑客但我在帖子图表创建功能中使用了一些jQuery来从条形高度移除1px并为y值增加1px，对于受影响的堆叠条，即。

{{1}}

围绕Highcharts Stacked Bars的自定义边框问题并禁用悬停效果

2 个答案: