[Solved] ConvertDataToPoint returns a point beyond the screen

[Erez]

Hi,

I'm using ConvertDataToPoint to locate the location on the screen for a certain data point.

This works perfectly until I zoom into the chart, then every call returns a point with X and Y in the thousands.

How can I get the correct information in zoomed-in mode?

Thank you.

[Rosy Topchiyska]

Hi Erez,

Thank you for contacting us.

Could you please send us a sample project that reproduces this issue.

I look forward to your reply.

Regards,
Rosy Topchiyska
Telerik

 

 

[Erez]

Hi Rosy and thank you for your prompt reply.

I'm unable to produce a sample project due to schedule limitations but would like to offer some more information:

1. Using RadCartasianChart with ChartSeriesProvider to create LineSeries elements based on data from a data source.
2. The chart contains a GridLine annotation.
3. Registered to the Tapped event on the RadCartasianChart:
3a. Relocate the GridLine annotation to the category that is closest the mouse location.  For that I use ConvertPointToData (that works well in all modes).
3b. Also relocate a custom control that displays information (similar to TrackBallInfo) in the same location of the GridLine.
I use my own custom control as TrackBallInfo is not displayable all the time, and since CustomAnnotation cannot be TranslateTransformed and does not forward ManipulationDelta events, to allow the user to move it out of the way when it blocks the view of the trend line.
For that I use ConvertDataToPoint which works well in Zoom 1.0, but returns bogus numbers in the thousands when the chart is zoomed in.
4. Registered to ManipulationDelta event on the RadCartasianChart to relocate my custom control to the new physical location of the GridLine upon panning/zooming.
For that I also use ConvertDataToPoint (and in such case my custom control gets lost due to the bogus coordinates).

Some XAML:

                <telerikChart:RadCartesianChart x:Name="chart" MinHeight="30" MinWidth="60" Tapped="chart_Tapped" ManipulationDelta="Canvas_ManipulationDelta" ManipulationMode="All">
                    <telerikChart:RadCartesianChart.SeriesProvider >
                        <telerikChart:ChartSeriesProvider Source="{Binding Trends}" x:Name="provider">
                            <telerikChart:ChartSeriesProvider.SeriesDescriptors>
                                <local:TrendChartSeriesDescriptor ItemsSourcePath="Items" ValuePath="Value" CategoryPath="DateTime">
                                    <local:TrendChartSeriesDescriptor.Style>
                                        <Style TargetType="telerikChart:LineSeries">
                                        </Style>
                                    </local:TrendChartSeriesDescriptor.Style>
                                </local:TrendChartSeriesDescriptor>
                            </telerikChart:ChartSeriesProvider.SeriesDescriptors>
                        </telerikChart:ChartSeriesProvider>
                    </telerikChart:RadCartesianChart.SeriesProvider>
                    <telerikChart:RadCartesianChart.Annotations>
                        <telerikChart:CartesianGridLineAnnotation Axis="{Binding HorizontalAxis, ElementName=chart}"
                                                              Stroke="#fcee21"
                                                              StrokeThickness="3"
                                                              Margin="0,-10,0,0"
                                                              />
                    </telerikChart:RadCartesianChart.Annotations>
                    <telerikChart:RadCartesianChart.Behaviors>
                        <telerikChart:ChartPanAndZoomBehavior ZoomMode="Both" PanMode="Both"/>
                    </telerikChart:RadCartesianChart.Behaviors>
...

Some code:

        void chart_Tapped(object sender, TappedRoutedEventArgs e)

        {

            if (this.chart.Series == null ||

                (this.chart.Series != null &&

                this.chart.Series.Count == 0))

                return;

            

            var mousePosition = e.GetPosition(chart);

 

            var tuple = chart.ConvertPointToData(mousePosition);

 

            DisplayAnnotations(tuple);

        }

        private void DisplayAnnotations(Tuple<object, object> tuple)

        {

            DateTime xCategory = (DateTime)tuple.Item1;

 

            LinearAxis vAxis = (LinearAxis)this.chart.VerticalAxis;

 

            foreach (var annotation in chart.Annotations)

            {

                CartesianGridLineAnnotation gridLine = annotation as CartesianGridLineAnnotation;

                if (gridLine != null)

                {

                    gridLine.Value = xCategory;
//The following gridLine.Tag will later be used to recalculate the new physical location 

                    gridLine.Tag = tuple;

//... prepare the info to be displayed

                    var point = chart.ConvertDataToPoint(tuple);

 

// AnnotationCP is my custom control

 

                    (AnnotationCP.RenderTransform as TranslateTransform).X = point.X;

                    AnnotationCP.Content = data;

               }

            }

        }

Upon chart manipulation:

private void Canvas_ManipulationDelta(object sender, ManipulationDeltaRoutedEventArgs e)
{
    foreach (var annotation in chart.Annotations)
    {
        CartesianGridLineAnnotation gridLine = annotation as CartesianGridLineAnnotation;
        if (gridLine != null &&
            gridLine.Tag != null)
        {
            DisplayAnnotations(gridLine.Tag as Tuple<object, object>);
        }
    }
}

Hope this gives you enough information.

Thank you,
Erez

[Erez]

Hi again.

In the meantime- I solved it (or worked around it) by myself:

var point = chart.ConvertDataToPoint(tuple);
(AnnotationCP.RenderTransform as TranslateTransform).X = point.X + chart.PlotAreaClip.Width * chart.ScrollOffset.X;

The ConvertDataToPoint does not take into consideration the scroll-offset for some reason.

Is this by-design?

Thank you,
Erez

[Rosy Topchiyska]

Hi Erez,

Thank you for writing.

We have to admit that there is an actual bug with the ConvertDataToPoint(...) method. The expected behavior is to return a point relative to the chart control area considering the scroll offset. This problem will be fixed for the upcoming release.

Please, let us know if you have other questions. I have also updated your telerik points as a token of gratitude for bringing this issue to our attention. 

Regards,
Rosy Topchiyska
Telerik

 

 

[Erez]

Thank you Rosy.

Glad to have helped!

I will just have to somehow remember to remove my workaround once the new version is installed, or it will become a bug on its own :-)

[Rosy Topchiyska]

Hi Erez,

When we fix the bug we will write back to you to remind you to update your code.

Regards,
Rosy Topchiyska
Telerik

 

 

[Erez]

That's considerate.

Thank you!

[Rosy Topchiyska]

Hello Erez,

I'm just writing to inform you that in the latest version of the controls Q2 2014 we have fixed the issue with the ConvertDataToPoint() method.

Regards,
Rosy Topchiyska
Telerik

 

 

[Erez]

Hi Rosy,

Thank you for letting me know and for this good service.

We will remove the workaround once we port to the newer version.

Erez