Search code examples
highchartsnavigator

"adaptToUpdatedData: false" in highcharts don`t works if I put series in chart with "addSeries"


I added 2 series in chart with "addSeries". Set property navigator.adaptToUpdatedData to false. Then I update data for series with "setData", if user zooms chart, but navigator is updated. If I update only 1 serie all works right. How fix it?

Example:

    <https://jsfiddle.net/zrxv30sh/1>

Solution

  • Y̶o̶u̶ ̶s̶h̶o̶u̶l̶d̶ ̶d̶e̶f̶i̶n̶e̶ ̶b̶o̶t̶h̶ ̶s̶e̶r̶i̶e̶s̶ ̶a̶s̶ ̶i̶n̶i̶t̶i̶a̶l̶s̶ ̶i̶n̶ ̶t̶h̶e̶ ̶n̶a̶v̶i̶g̶a̶t̶o̶r̶ ̶c̶o̶n̶f̶i̶g̶.̶

     n̶a̶v̶i̶g̶a̶t̶o̶r̶:̶ ̶{̶
         a̶d̶a̶p̶t̶T̶o̶U̶p̶d̶a̶t̶e̶d̶D̶a̶t̶a̶:̶ ̶f̶a̶l̶s̶e̶,̶
         s̶e̶r̶i̶e̶s̶:̶ ̶[̶{̶
            d̶a̶t̶a̶:̶ ̶d̶a̶t̶a̶
         }̶,̶ ̶{̶ 
            d̶a̶t̶a̶:̶ ̶d̶a̶t̶a̶2̶
         }̶]̶
    }̶,̶ 
    

    D̶e̶m̶o̶:̶ ̶h̶t̶t̶p̶s̶:̶/̶/̶j̶s̶f̶i̶d̶d̶l̶e̶.̶n̶e̶t̶/̶B̶l̶a̶c̶k̶L̶a̶b̶e̶l̶/̶n̶v̶m̶r̶y̶z̶L̶g̶/̶

    After dig deeper into I found that the problem is with this part of the code:

       data.forEach(function(item){
          data2.push([item[0],item[1]+50,item[2]+50,item[3]+50,item[4]+50])
        })
        chart.series[0].setData(data);
        chart.series[1].setData(data2);
        chart.hideLoading();
    

    Because chart.series[1] is defined as a navigator series which means that this setData config updates the navigator series.

    Changing to chart.series[2] fix the issue.

    Demo: https://jsfiddle.net/BlackLabel/w3cfLmqt/