Highcharts: Gestapelte Spalte Erhöhung border auf ausgewählten Zustand

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)' 
     } 
    } 
    } 
} 

In der obigen Geige habe ich die auserwählten Zuständen für die Stapel definiert. Es gibt Leerzeichen zwischen den Stapeln wegen borderWidth: 8 und default borderColor: '#FFFFFF'. Ich möchte die Leerzeichen zwischen den Stapeln zunächst nicht (d. H. Ohne irgendeine Auswahl zu treffen), und die borderWidth sollte nur zunehmen, wenn ich einen Stapel auswähle. Gibt es einen Weg, dies zu erreichen?

Answer 1

Dies scheint wie ein schwieriger. Getestet habe ich aus ein paar verschiedene Konfigurationen basierend auf einige Fragen, die ich an anderer Stelle auf Stack-Überlauf gefunden (siehe unten), und es scheint, dass Sie Folgendes ausführen können:

• Wenn Sie „Zustände“ auf „Ereignisse“ Sie Die Änderung der Rahmengröße kann in den Zuständen "mouseOver" und "mouseOut" erfolgen, nicht jedoch im Zustand "select".

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

• Wenn Sie „wählen Sie“ ändern, wenn Sie die Breite an anderer Stelle definiert haben zu „schweben“ in der „Zustände“ Klausel können Sie die Grenzfarbe (borderColor) ändern, aber Sie die Breite nicht ändern können (unter Verwendung borderWidth).

Hier sind die Fragen, die ich für diese Antwort verwiesen:

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

Ich weiß, das löst nicht genau Ihr Problem, aber ich hoffe, dass die Informationen Ich fand, dass es für dich hilfreich sein wird.