Highcharts - Stockchart Zoom position without Navigator

user_1900892 0
Viewed 97

I have the following config for my Stock Chart:

const stockChartOptions = {
  chart: {
    type: 'column',
    zoomType: 'x',
  },

  series: [
    {
      type: 'column',
      name: 'error',
      stack: 'es',
      data: [],
      color: 'red',
    },
    {
      type: 'column',
      name: 'success',
      stack: 'es',
      data: [],
      color: 'blue',
    },
    {
      type: 'column',
      name: 'warning',
      stack: 'w',
      data: [],
      color: 'yellow',
    },
  ],

  navigator: {
    adaptToUpdatedData: false,
    series: [
      {
        data: [],
        color: 'blue'
      },
    ],
  },

  scrollbar: {
    liveRedraw: false
  },

  title: {
    text: ''
  },

  subtitle: {
    text: ''
  },

  plotOptions: {
    column: {
      stacking: 'normal'
    },
  },

  rangeSelector: {
    buttons: [
      {
        type: 'week',
        count: 1,
        text: '1 week',
      }, {
        type: 'month',
        count: 1,
        text: '1 month',
      },{
        type: 'month',
        count: 3,
        text: '3 month',
      },
    ],
    inputEnabled: false,
    selected: 4,
  },

  xAxis: {
    minRange: 24 * 3600 * 1000
  },

  yAxis: {
    floor: 0
  },
  
};

The important thing is the navigator. In this case when loaded the default zoom is one week and the range is most recent dates. When I replaced the navigator field with this:

navigator: {
  enabled: false
}

The zoom is one week, but it is showing the dates from the beginning. Not the most recent dates as before. What should I do in order to remove the navigator and still the default zoom (1 week) to show most recent dates?

Thank you in advance.

highcharts
1 Answers

After a long search for answer and particularly trying to solve that behavior through the chart configuration, not through subsequent adjustments I manage to find one solution. Just add this field as property of navigator property:

adaptToUpdateData: false

And it will become like this:

navigator: {
  enabled: false,
  adaptToUpdateData: false
}

This way the navigator is removed from the chart but the default zoom shows most recent dates.

user_19008920
Related