1. Home
  2. Forum
  3. Flutter
  4. ZoomByRange

ZoomByRange

Is there a way in the Flutter library to mimic functionality similar to ZoomByRange in the Xamarin platform?

Reference: https://www.syncfusion.com/forums/132926/programmatically-zoom-and-pan-sfchart

9 Replies 1 reply marked as answer
SK Sriram Kiran Senthilkumar Syncfusion Team October 8, 2020 03:58 PM UTC

Hi Cory, 
  
Greetings from Syncfusion. We have analyzed your scenario and currently, we do not have zoomByRange public method support in our zoomPanBehavior to programmatically zoom to given range. However, we can achieve this scenario with the help of the visibleMinimum and visibleMaximum properties of an axis available in the chart. We have created a simple sample in which we have rendered a chart with several data points and also initialized two global variables for storing the values of the visible minimum and visible maximum properties with default visible range values. We have rendered a button which helps in changing the visible range of the chart axis (i.e., setting values for visible minimum and maximum inside setState() function) on pressed. Thus, on pressing this button, the chart will be zoomed to the provided visible range values along the axis. We have also attached the sample below for further reference. 
  
For further reference on the visibleMinimum and visibleMaximum properties, please check the user guides below. 

Please check the above-attached sample and revert us if you still have further concerns. 

Regards, 
Sriram Kiran 


Marked as answer
CO Cory October 9, 2020 04:03 PM UTC

Hey there,

I tried this out, and the visibleMinimum and visibleMaximum properties do work as you have described. However, after a user has interacted with the chart by zooming and panning themselves, setting the state of visibleMinimum and visibleMaximum no longer works to change the zoom back to a specific range of data.

Is there a way to overcome this?

SK Sriram Kiran Senthilkumar Syncfusion Team October 12, 2020 12:16 PM UTC

Hi Cory, 
  
We have analyzed your scenario at our end and the reported issue regarding once the chart is zoomed or panning then setting the state of visibleMinimum and visibleMaximum no longer works to change the zoom back to a specific range of data is already fixed at our side and the fix for the reported issue will be included in our upcoming weekly patch release which is expected to be rolled out by the middle of next week. We will update you once the release is rolled out and we appreciate your patience until then. 
  
Regards, 
Sriram Kiran 


SK Sriram Kiran Senthilkumar Syncfusion Team October 21, 2020 03:42 PM UTC

Hi Cory, 
 
Thanks for your patience. The reported issue regarding once the chart is zoomed or panning then setting the state of visibleMinimum and visibleMaximum no longer works to change the zoom back to a specific range of data is now fixed and rolled out in our weekly patch release. To overcome the reported issue, kindly please upgrade the chart widget package to the latest version below and also there is a small modification that is to be done in the sample which is before setting state of the visible minimum and Visible maximum always call the reset public method of the ZoomPanBeahvior so that the visible range for the chart will be set even when the chart is in zoomed state. We have also attached the modified sample below for your reference. 
  
For further reference on the reset public method of the ZoomPanbehavior, please check the user guide below. 
 
Please check with the above-attached sample and revert us if you have further concerns. 
 
Regards, 
Sriram Kiran 


CD Cory Davis November 10, 2020 01:51 AM UTC

Thanks! This works quite well!

I am noticing one thing though, after setting the visible minimum and maximum, then panning the screen manually, it changes the relative height of items on a bar graph. The height doesn't change after panning back, because the height after the initial pan is the correct value. Is there a way to get a smooth pan with no initial snapping height change, getting the after panning height set from the start? I have tried using the following code before re-rendering with the new visible minimum and maximum:

zoomingBehavior.zoomIn();
zoomingBehavior.panToDirection('right');
zoomingBehavior.zoomOut();
This does work, but it eliminates the transition animations.


SK Sriram Kiran Senthilkumar Syncfusion Team November 10, 2020 12:32 PM UTC

Hi Cory,  
  
We have analyzed your scenario with the provided information at our end and we would like to share some information regarding your query “panning the screen manually, changes the relative height of items on a bar graph.” and this is due to the automatic y-axis range calculation feature available in the chart which on enabled in the chart, the y-axis range calculation is done dynamically based on the visible points in the char. This feature can be toggled on or off by setting the anchorRangeToVisiblePoints Boolean property of the chart value axis(y-axis). So, we kindly request you to disable this feature by setting false for the anchorRangeToVisiblePoints property in the value axis to overcome the reported scenario. Please refer the code snippet below for further reference. 
SfCartesianChart( 
             primaryYAxis: NumericAxis(anchorRangeToVisiblePoints: false), 
          ) 
 
Also, if you think that we have misunderstood you query then, we kindly request you to share us with more information on your query along with example screenshots or screen recordings so that it will help provide the solutions sooner. 
 
For further reference on the anchorRangeToVisiblePoints property, please refer the user guide below. 
  
Regards, 
Sriram Kiran 


CD Cory Davis February 3, 2021 04:48 AM UTC

In the latest version of the package, my code and the example code given no longer work. After visibleMinimum/Maximum is changed, you can't pan anymore.

Is there a new way to do this, or was a bug introduced recently?

DP Dharanitharan Palanisamy Syncfusion Team February 4, 2021 01:11 PM UTC

Hi Cory, 
We have replicated your reported scenario at our end, and we regret the inconvenience. We will resolve this in the weekly patch release which is expected to be rolled out on 16th February 2021. We appreciate your patience until then 
 
Thanks,   
Dharanitharan. P   



DP Dharanitharan Palanisamy Syncfusion Team February 16, 2021 07:33 AM UTC

Hi Cory, 

Thanks for being patience and we are glad to inform you that the reported issue got fixed in our latest version v18.4.43. Now, after zooming or panning then setting visible minimum and visible maximum works properly like in our previous given sample. To resolve this kindly upgrade our charts to the latest version from the following link. 

Thanks, 
Dharanitharan. P 


Loader.
Up arrow icon