Изменение ZIndex в HighChart

Question

с помощью Highchart, как мы можем изменить ZIndex для линии в соответствии с его состоянием, или динамически из клика события?

Я пробовал:

plotOptions: { 
     series: { 
       states: { 
        select: { 

          lineWidth: 2, 
          zIndex:10 
        } 
       }, 

с: 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 
       } 
      } 
     } 
    }