Обновление серии Цвет появляется, чтобы разбить навигатор и селектор диапазона

Question

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

var rainbow = new Rainbow(); 
// Set start and end colors 
rainbow.setSpectrum('#528bc2', 'white'); 
// Set the min/max range 
var numSeries = chart.series.length; 
var rangeLow = 0; 
var rangeHigh = numSeries 
rainbow.setNumberRange(rangeLow, rangeHigh); 

// Loop over data and update the color value 
for (index = 0; index < numSeries; ++index) { 
    if (chart.series[index].name != 'Navigator') { 
     if (chart.series[index].options.yAxis == 1) { 
      chart.series[index].update({ 
       color: '#000080' 
      }, false); 
    } else { 
     chart.series[index].update({ 
      color: '#' + rainbow.colourAt(index) 
     }, false); 
    } 
    if (chart.series[index].visible) { 
     var navigator = chart.get('nav'); 
     navigator.setData(chart.series[index].options.data); 
    } 
} 

Это правильно обновить цвета, и я могу Отмените изменения, чтобы использовать другой список цветов в массиве, когда пользователь хочет вернуться обратно.

Карточка загружена так, что за один раз видна только одна серия, и эта серия используется в серии навигаторов. Когда пользователь нажимает на серию в легенде, он скрывает другую серию от графика и отображает только выбранную серию, обновляет серию навигаторов и обновляет заголовок диаграммы. Это прекрасно работает, когда пользователь не меняет цвет.

Проблема, с которой я сталкиваюсь, заключается в том, что, когда пользователь находится в серии, отличной от первоначально загруженной серии, когда они меняют цвет, серия навигаторов возвращается к набору данных серии [0] из-за вызываемого chart.redraw(). Как я могу получить серию навигаторов в качестве видимой в данный момент серии после вызова кода обновления? Я попытался положить этот код (или аналогичный блок) после обновления цвета и chart.events.load без видимого ущерба:

for (i = 0; i < this.series.length; i += 1) { 
    if (this.series[i].name != 'Navigator') { 
     if (this.series[i].visible) { 
     console.log(this.series[i].name); 
     var navigator = this.get('nav'); 
     navigator.setData(this.series[i].options.data); 
     } 
    } 
} 

Вот живой набор данных для работы в jsFiddle. Чтобы воспроизвести проблему, позвольте нагрузке на диаграмму, а затем нажмите «Data Trend (%)» в легенде, чтобы она была видна на диаграмме. Обратите внимание, что серия навигаторов изменилась на эту серию. Теперь в раскрывающемся списке измените выбранное значение на «Многоцветный». Обратите внимание на то, как изменился цвет серии, но также имеет данные серии навигаторов.

Answer 1

Навигатор имеет два свойства, которые относятся к серии. Первый - это собственный объект серии - вы обновляете его свойство данных, второе - baseSeries, которое ссылается на основную серию из диаграммы. http://jsfiddle.net/1jz3r78v/1/

Если вы установили baseSeries в видимую серию, он работает так, как вы ожидали.

  serie[i].show(); 
      var navigator = this.chart.get('nav'); 
      this.chart.scroller.baseSeries = this; // serie[i] 
      navigator.setData(serie[i].options.data); 
      this.chart.setTitle({ 
       text: serie[i].name 
      }); 

Пример: https://jsfiddle.net/yct6y11m/1/