PabOffset - Zoom

[ManniAT]

I have a Chart with some LineSeries and a DateTimeContinousAxis.

Depending on the device orientation I want to display (lets say) 8 (Portrait) or 14 (Landscape) Days on the grid.
So I need to set a ZoomLevel and a PanOffset according to the data I get.
-- I need the pan offset since I want to display the last datapoints at startup (data loading).

This data sometimes contains just 2 days - and sometimes several months.

Is there an easy way to achieve this?

Manfred

[ManniAT]

Just to be a bit more precise.
What I want is:
Display XXX Days - or in other words 1 Day per YYY pixels.
-- I set a constant for YYY.
Scroll to the end if zoom / Pan is needed.

Manfred

[Victor]

Hello Manfred,

Thank you for writing.
Since your day count per orientation ratio is 14 / 8. When you rotate to display 8 days, you need to set the zoom factor of the chart to something around 1.75 (14 / 8). I found out that 1.8 is best on the test app that I am working with (see attachment). Then you just need to set the pan offset like this:

double panOffset = this.chart.RenderSize.Width - this.chart.RenderSize.Width * 1.8;
this.chart.PanOffset = new Point(panOffset, 0);

Also, please keep in mind that RadChart currently does not process points that are outside the chart plot area, in this case, points that are outside the min/max range of the date time axis. You need to filter your data points so that all of the points in the filtered subset fit inside the min/max dates. Otherwise you will get undefined behavior.

Please write again if you need further assistance.

Regards,
Victor
the Telerik team

[ManniAT]

Hi Victor,

thank you for your answer and sorry for my delay.
Your answer solves landscape / portrait but not the general problem.

What I need is some kind of formula to calculate a "fixed day width".
I found out (just a number) that 10 days fit on my chart.
So assume I have data with just two days.
This will (of course) fit on the chart - so I have a zoom of One an no panning.

Later I have 20 days of data.
Now I have to zoom to 0.5 in X so that I'll see those 20 items in a way that 10 items are on my chart area.
With 40 days this will be 0.25 and so forth.
Panning (in these cases) should be set so that the last points are visible.

To be more precise - I have the offset in pixels per day.
I can  get these values just by checking out the results with test data.

My need is a formula to calculate the zoom depending on the data I have.

Manfred

[Victor]

Hi Manfred,

From what I understand you need to include the size of the data set in the formula since it is dynamic. That is, it can be 14 data items or 100 and therefore the 14/8 ration becomes invalid? If this is the case you can try this:

const double dayCount = 10;
public MainPage()
{
    InitializeComponent();

    List<MyData> data = new List<MyData>();
    DateTime day = new DateTime(2012, 2, 1);
    for (int i = 0; i < 50; ++i)
    {
        data.Add(new MyData() { Value = i, Date = day.AddDays(i) });
    }

    this.chart.Series[0].ItemsSource = data;

    this.Loaded += (sender, args) =>
        {
            double zoomFactor = data.Count / dayCount;
            double panOffset = this.chart.RenderSize.Width - this.chart.RenderSize.Width * zoomFactor;
            this.chart.Zoom = new Size(zoomFactor, 1);
            this.chart.PanOffset = new Point(panOffset, 0);
        };
}

Just change the ratio to be data.Count / dayCount. This way it will always display 10 days.
If the zoomFactor is less than 1 you should simply set zoom and pan to 0 and return from the handler.

Please write again if you have other questions.

Greetings,
Victor
the Telerik team