I want to set the range of a angular highstock chart by clicking onanother component table or button.
Simple example, for selecting range T1 or T2 with setExtremes does not work: (https://stackblitz.com/edit/angular-ivy-49z46k?file=src%2Fapp%2Fapp.component.ts)
In the next example I try to set the min max direct on the xAxis[0].min =value. Sometimes it works twice but when you click multiple times it stops interacting.
You have two mistakes in your code:
this
in your chartCallback function points to a chart, use an arrow function to use component context.setExtremes
needs to be called on this.chart.xAxis[0]
, not this.chart.xAxis
chartCallback = (chart: Highcharts.Chart) => {
this.chart = chart;
}
changeRange(min, max){
this.chart.xAxis[0].setExtremes(
min,
max
);
}