Get chart coordinates for mouse position

[Peter Van Dender]

Hi,

I have to create a Silverlight client, and one of the key requirements is to show the exact X and Y chart-coordinates of the cursor when it's hovering above a chart.

I searched the forum for this, but only found answers saying this isn't possible yet. (like in thread http://www.telerik.com/community/forums/silverlight/chart/coordinates-within-radchart.aspx)

Is this still the case in version 2011 Q1?

I tried using this code, but the chartarea also includes the drawing space for the axis and labels, so the calculation is incorrect.

I think the problem would be solved if the plotarea was accessible, so I could get the position relative to it.
Like so: var position = e.GetPosition(ChartArea.PlotArea);

private void OnChartMouseMove(object sender, MouseEventArgs e)
        {
            var position = e.GetPosition(ChartArea);

            var pctY = 1 - (position.Y / ChartArea.ActualHeight);
            var pctX = position.X / ChartArea.ActualWidth;

            var x = ChartArea.AxisX.MinValue * (1 - pctX) + ChartArea.AxisX.MaxValue * pctX;
            var y = ChartArea.AxisY.MinValue * (1 - pctY) + ChartArea.AxisY.MaxValue * pctY;

            X.Text = x.ToString("f2");
            Y.Text = y.ToString("f2");
        }

 

kind regards,

Peter

[Missing User]

Hi Peter,

You can get the PlotArea in the ChartArea.Loaded event by the extension method ChildrenOfType<ClipPanel>(). In order to use this extension, you need to include namespace reference to Telerik.Windows.Controls. After that you can attach MouseEnter and MouseLeave handlers to the PlotArea. For example:

private void ChartArea_Loaded(object sender, System.Windows.RoutedEventArgs e)
{
    Panel plotArea =
        this.radChart.DefaultView.ChartArea.ChildrenOfType<ClipPanel>().FirstOrDefault() as Panel;
    if (plotArea != null)
    {
        plotArea.MouseEnter += content_MouseEnter;
        plotArea.MouseLeave += content_MouseLeave;
    }
}

In the Mouse events you can get the physical coordinates of the mouse according to the PlotArea. You can also convert these physical units to data units by the Axis exposed method ConvertPhysicalUnitsToData(physicalUnit). For example:

public void content_MouseEnter(object sender, MouseEventArgs e)
{
    Panel plotArea = sender as Panel;
    if (plotArea != null)
    {
        Point physicalPosition = e.GetPosition(plotArea);

        ChartArea chartArea = this.radChart.DefaultView.ChartArea;
        double x = chartArea.AxisX.ConvertPhysicalUnitsToData(physicalPosition.X);
        double y = chartArea.AxisY.ConvertPhysicalUnitsToData(physicalPosition.Y);
    }
}

I hope this helps.

Regards,

Polina

the Telerik team

[Peter Van Dender]

Hi Polina,

Finally had some time to test this (I was working on another project for a while), and it works fine.
Thanks!

Kind regards,

Peter