javascript - Highcharts:Stacked Column 在选择状态下增加 borderWidth

Question

http://jsfiddle.net/sgrg93/4d08tj96/3/

plotOptions: {
  column: {
    allowPointSelect: true,
    stacking: 'normal',
    borderWidth: 8,      //This is giving spaces in between which I want to avoid
    dataLabels: {
      enabled: true,
      color: 'white',
      style: {
        textShadow: '0 0 3px black'
      }
    },
    states: {
      select: {
        color: null,
        borderWidth: 8,      //border width should increase on select
        borderColor: 'rgba(0,0,0,0.4)'
      }
    }
  }
}

在上面的 fiddle 中，我已经定义了堆栈的选择状态。由于 borderWidth: 8 和默认 borderColor : '#FFFFFF'，堆栈之间有空格。我最初不想要堆栈之间的空间(即不做任何选择)并且 borderWidth 应该只在我选择任何堆栈时增加。有什么办法可以实现吗？

Answer 1

这似乎是一个棘手的问题。我根据在 Stack Overflow 上其他地方发现的一些问题测试了几种不同的配置(见下文)，看来您可以执行以下操作:

• 如果将“states”更改为“events”，则可以更改“mouseOver”和“mouseOut”状态的边框大小，但不能更改“select”状态。

  events: {
      mouseOver: function () {
         this.update({
            borderWidth: 8
         });                
     },
     mouseOut: function () {
         this.update({
             borderWidth: 0
         }); 
     }}
  }
  

• 如果在“states”子句中将“select”更改为“hover”，并且在别处定义了宽度，则可以更改边框颜色 (borderColor)，但您可以' 更改宽度(使用 borderWidth)。

以下是我在此回复中提到的问题:

• > Highcharts: changing color on hover ranking chart
• > Highcharts Change column color on hover

我知道这并不能完全解决您的问题，但我希望我找到的信息对您有所帮助。