addTo(String arrayName, Object options [, Number index = array.length [,Boolean updateStockChart = true]])

Adds a new element of given type to the specified array in navigator. For example, it can be used to add a new dataSeries to data array of navigator.

        propertyName: Name of the property
        options: Option for the new element
        index: Index of the array where the new element has to be added. Defaults to the length of array.
        updateStockChart: When true, updates the StockChart after setting the value. Default value is true.

Example: stockChart.navigator.addTo(“data”, { type: “line”, dataPoints: dataPoints2 });

  • StockChart should be rendered before you can use addTo method.
  • StockChart re-renders automatically after addTo method. It is recommended to disable the auto update by setting updateStockChart to false till the last step if you have multiple properties. Otherwise the performance might be affected because of rendering StockChart repeatedly.

var stockChart = new CanvasJS.StockChart("container",
 navigator: {
   data: [{
     dataPoints: dataPoints1,

stockChart.navigator.addTo("data", { type: "line", dataPoints: dataPoints2 });

Try it Yourself by Editing the Code below.

If you have any questions, please feel free to ask in our forums.