NativeScript / nativescript-ui-charts

NativeScript wrapper around HiCharts library
Apache License 2.0
26 stars 6 forks source link

Cannot find a way to reset extremes #22

Closed dangrima90 closed 3 years ago

dangrima90 commented 3 years ago

I am making use of the setExtremes() function to zoom into a part of the chart I am displaying. An issue I am facing is that I cannot seem to be able to reset the extremes.

I am working with NativeScript Vue - NS7; Package version 0.1.0.

Sample Code:

// setting extreme - works as expected
this.chartView.setExtremes(today - range, today);

To reset the extremes I've tried to setting the min and max to null as according to this both min and max accept a null value. My guess is that null is set when no extremes are set.

Running the following failed:

// min, max as null
this.chartView.setExtremes(null, null);

// or...
this.chartView.setExtremes();

This failed due to the logic always parsing the parameters to a long value: https://github.com/NativeScript/nativescript-ui-charts/blob/262ddc3873a414ee07db6f6096ed83b7c72657cb/src/ui-charts.android.ts#L94-L103

A workaround I tried is trying to replicate the same logic above but from my end:

const options = this.chartView.nativeView.getOptions();
const xAxisArr = options.getXAxis();
const xAxis = xAxisArr.get(0);
xAxis.setMin(null);
xAxis.setMax(null);
this.chartView.nativeView.zoomOut();
this.chartView.nativeView.update(options);

Although the above didn't result in any errors, the chart did not reset. Not sure if there's an issue from my end here. Thanks in advance!

shiv19 commented 3 years ago

We're using it like this in our app.

i in the function comes from the index of a segmented bar with the options "All, Week, Day, Hour"

So if this function gets "0" for i, then the chart resets to show all the data.

export function setChartZoomLvl(i, chartView, segmentedBar) {
  const min = chartView.options.options.time_min;
  const max = chartView.options.options.time_max;
  const now = Date.now();
  const newMax = i !== 0 && now < max ? now : max;
  let newMin;
  if (segmentedBar.monthMode) {
    newMin = i === 3 ? newMax - hour : i === 2 ? newMax - day : i === 1 ? newMax - week : newMax - month;
  } else {
    newMin = i === 3 ? newMax - hour : i === 2 ? newMax - day : i === 1 ? newMax - week : min;
  }

  chartView.setExtremes(newMin, newMax);
}
dangrima90 commented 3 years ago

Great thanks 👍 that's similar to what I needed