Visible Range after Zoom-in

[Youfei]

Hi

I have been frustrated about this.. What I need is simple – Need to know the visible ranges of both X & Y axis. I am using a Range Selector, but it seems only to give me X ranges. I need Y too. (Also using a LassoZoomController) I have not been able to find anything. Please help.

Thanks

[Hristo]

Hi Youfei,

Thank you for writing.

You can perform iterate your data points and perform a check if they are contained within the visible view:

public partial class Form1 : Form
{
    public Form1()
    {
        InitializeComponent();

        ChartPanZoomController panZoomController = new ChartPanZoomController();
        panZoomController.PanZoomMode = ChartPanZoomMode.Both;
        radChartView1.Controllers.Add(panZoomController);

        LineSeries lineSeries = new LineSeries();
        Random r = new Random();
        for (int i = 0; i < 25; i++)
        {
            lineSeries.DataPoints.Add(new CategoricalDataPoint(r.Next(100), "Cat " + i));
        }

        this.radChartView1.Series.Add(lineSeries);
    }

    private void button1_Click(object sender, EventArgs e)
    {
        IChartView view = ((IChartView)this.radChartView1.View);
        foreach (var series in this.radChartView1.Series)
        {
            foreach (var dp in series.DataPoints)
            {
                CategoricalDataPoint cdp = (CategoricalDataPoint)dp;
                if (CheckIfDataPointIsVisible(view, cdp))
                {
                    Console.WriteLine(cdp.Category + " " + cdp.Value);
                }
            }
        }
    }

    private bool CheckIfDataPointIsVisible(IChartView view, CategoricalDataPoint cdp)
    {
        bool inXRange = cdp.LayoutSlot.X >= -view.PlotOriginX && cdp.LayoutSlot.X <= -view.PlotOriginX + view.ViewportWidth;
        bool inYRange = cdp.LayoutSlot.Y >= -view.PlotOriginY && cdp.LayoutSlot.Y <= -view.PlotOriginY + view.ViewportHeight;

        return inXRange && inYRange;
    }
}

I hope this helps. Should you have further questions please do not hesitate to write back.

Regards,
Hristo Merdjanov
Telerik by Progress

[Youfei]

Thanks Hristo! I now know the zooming happens on view level instead of ChartView level which helps!

However I am working on ScatterChartView and my view doesn't even have PlotOriginX, nor ViewportWidth.

All I need to know is the new Axis' display range after zooming, isn't there any straightforward way to get it please?

Thanks!

[Hristo]

Hi Youfei,

Thank you for writing.

The needed properties are defined in the IChartView interface which is explicitly implemented by the ChartView class. In order to access them, you need to cast the RadChartView.View object to IChartView.

I have modified the code snippet to include an example with a ScatterSeries. Please see below: 

public partial class Form2 : Form
{
    public Form2()
    {
        InitializeComponent();

        ChartPanZoomController panZoomController = new ChartPanZoomController();
        panZoomController.PanZoomMode = ChartPanZoomMode.Both;
        radChartView1.Controllers.Add(panZoomController);

        ScatterSeries scatterSeries = new ScatterSeries();
        Random r = new Random();
        for (int i = 0; i < 25; i++)
        {
            scatterSeries.DataPoints.Add(new ScatterDataPoint(i, r.Next(100)));
        }

        this.radChartView1.Series.Add(scatterSeries);

        ((LinearAxis)this.radChartView1.Axes[0]).LabelFitMode = AxisLabelFitMode.None;
        ((LinearAxis)this.radChartView1.Axes[0]).LabelInterval = 1;
        ((LinearAxis)this.radChartView1.Axes[0]).MajorStep = 1;
    }

    private void button1_Click(object sender, EventArgs e)
    {
        IChartView view = ((IChartView)this.radChartView1.View);
        foreach (var series in this.radChartView1.Series)
        {
            foreach (var dp in series.DataPoints)
            {
                ScatterDataPoint sdp = (ScatterDataPoint)dp;
                if (CheckIfDataPointIsVisible(view, sdp))
                {
                    Console.WriteLine(sdp.XValue + " " + sdp.YValue);
                }
            }
        }
    }

    private bool CheckIfDataPointIsVisible(IChartView view, ScatterDataPoint sdp)
    {
        bool inXRange = sdp.LayoutSlot.X >= -(view.PlotOriginX) && sdp.LayoutSlot.X <= -view.PlotOriginX + view.ViewportWidth;
        bool inYRange = sdp.LayoutSlot.Y >= -(view.PlotOriginY) && sdp.LayoutSlot.Y <= -view.PlotOriginY + view.ViewportHeight;

        return inXRange && inYRange;
    }
}

I hope this helps. Please let me know if you need further assistance.

Regards,
Hristo Merdjanov
Telerik by Progress

[Youfei]

Thanks Hristo for your prompt response and updated code. 

However it doesn't completely solve my issue -- I need to know the ranges of both X & Y axis after zooming.

My use case is, I have a few charts open at the same time, and when one of them is zoomed, I need all others to be zoomed into the same range. Besides knowing X & Y ranges, is there any alternatives?

Thanks again!

[Hristo]

Hi Youfei,

Thank you for writing back.

The view object provides access to the current pan and zoom settings. You can access these values this way: 

IChartView view = ((IChartView)this.radChartView1.View);
double panX = view.PlotOriginX;
double panY = view.PlotOriginY;
double zoomX = view.ZoomWidth;
double zoomY = view.ZoomHeight;

As I understand, you are having multiple charts and you would like to have them zoomed and panned simultaneously. In this scenario, you may also consider using a single chart having multiple axes: http://docs.telerik.com/devtools/winforms/chartview/axes/multiple-axes.

I hope this helps. Should you have further questions please do not hesitate to write back.

Regards,
Hristo Merdjanov
Telerik by Progress

[Youfei]

Thanks Hristo. Unfortunately having multiple series / axes is not feasible solution in our case. We are considering dropping the feature.

Anyway thanks for the help!

[Hristo]

Hi Youfei, 

Thank you for writing back.

Knowing the current zoom factors of a particular chart you can zoom another chart with the save values. This is straight forward if the data points along the axes of all the charts are within the same count.

If the charts are showing data having a different count of the data points you would need to perform calculations for each of the charts and scale the zoom and pan factors. 

I am sending you attached a sample project demonstrating the suggested approach.

I hope this will help. Please let me know if you need further assistance.

Regards,
Hristo Merdjanov
Telerik by Progress