Highcharts: Нажмите, чтобы обновить цвет колонок --- нужна мышь?

Question

Я попытался построить график с типом столбца с одной серией. Данные могут быть как положительными, так и отрицательными. Я попытался обновить цвет точек, которые больше 0 (или меньше 0) одним щелчком мыши. При следующем примере:

var chart = new Highcharts.Chart({ 
    chart: { 
     renderTo: 'container', 
     type: 'column' 
    }, 
    xAxis: { 
     categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'] 
    }, 

    plotOptions: { 
     series: { 
      cursor: 'pointer', 
      point: { 
       events: { 
        click: function() { 
         for (var i = 0; i < this.series.data.length; i++) { 
          if (this.y < 0) { 
           if (this.series.data[i].y < 0) 
            this.series.data[i].update({ color: '#ECB631' }, false, false); 
          }else { 
           if (this.series.data[i].y > 0) 
            this.series.data[i].update({ color: '#ECB631' }, false, false); 


          } 
         } 
        } 
       } 
      } 
     } 
    }, 

    series: [{ 
     data: [29.9, -71.5, 106.4, -129.2, 144.0, 176.0, -135.6, 148.5, -216.4, 194.1, 95.6, 54.4], 
     negativeColor: '#FF0000' 
    }] 
}); 

Вот the link. http://jsfiddle.net/CkkbF/57/

я обнаружил, что-то интересное и странное:

1. Если данные точки положительна, то щелкнул цвет столбец будет изменен, но другие столбцы с положительными данными имеют немного другой цвет (кажется выделенной.)

2. Если данные точки отрицательные, цвет с нажатыми колонками останется таким же (красный в моем примере), пока вы не вытащите его. Остальные столбцы с отрицательными данными остаются неизменными, если вы не попытаетесь вставить их в/из них.

Возможно, ошибка? Как я могу их правильно обновить?

Answer 1

Я думаю, что вы хотите обновить цвет серии, или серии negativeColor, посмотрите: http://jsfiddle.net/CkkbF/60/

plotOptions: { 
     series: { 
      cursor: 'pointer', 
      point: { 
       events: { 
        click: function() { 
         if (this.y > 0) { 
          this.series.update({ 
           color: "#ECB631" 
          }); 
         } else { 
          this.series.update({ 
           negativeColor: "#ECB631" 
          }); 
         } 

        } 
       } 
      } 
     } 
    },