使用Highchart更改HighChart中的zIndex

Question

，我們如何根據其狀態更改zIndex或者從點擊事件？

我想：

​​

有：this.setState(this.state === 'select' ? '' : 'select');在點擊事件，但它不工作。

Answer 1

好吧，它絕對不是很漂亮，但我找不到一個方法來真正設置zIndex，所以我必須做一些操作來僞造它，並按照特定的順序將每個系列放到前面。這裏的片段包括：

Highcharts.Series.prototype.setState = (function (func) { 
     return function() { 
      if (arguments.length>0){ 
       if (arguments[0] !== ''){ 
        if (typeof this.options.states[arguments[0]]['zIndex'] !== 'undefined'){ 
         this.options.oldZIndex = this.group.zIndex; 
         this.group.zIndex = this.options.states[arguments[0]]['zIndex']; 
        } 
       }else{ 
        if (typeof this.options['oldZIndex'] !== "undefined"){ 
         this.group.zIndex = this.options['oldZIndex']; 
        } 
       } 
       var order = [], i = 0; 
       $.each(this.chart.series, function(){ 
        order.push({id:i,zIndex:this.group.zIndex,me:this}); 
        i++; 
       }); 
       order.sort(function(a,b){return (a.zIndex>b.zIndex) ? 1 : -1;}); 
       $.each(order, function(){ 
        this.me.group.toFront(); 
       }); 
       func.apply(this, arguments); 
      } 
     }; 
    } (Highcharts.Series.prototype.setState)); 

而這裏的示範的jsfiddle：

http://jsfiddle.net/G9d9H/9/

讓我知道，如果這就是你需要的。

Answer 2

我認爲更好的解決方案是設置點擊series.group.toFront（）方法（我更喜歡把它用在鼠標懸停）

plotOptions: { 
     series: { 
      events: { 
       click: function() { 
        this.group.toFront();//bring series to front when hovered over 
       } 
      } 
     } 
    }