RadCartesianChart

[Andrew]

How can you mark single points on a AreaSeries in a RadCartesianChart and have a little label point to the marked point?

[Giuseppe]

Hello Andrew,

You can define custom AreaSeries.PointTemplate for each series item and you can also set AreaSeries.ShowLabels property to true to display the series item labels like this:

<telerik:RadCartesianChart x:Name="RadChart1" Palette="Metro">
    <telerik:RadCartesianChart.HorizontalAxis>
        <telerik:CategoricalAxis />
    </telerik:RadCartesianChart.HorizontalAxis>
    <telerik:RadCartesianChart.VerticalAxis>
        <telerik:LinearAxis />
    </telerik:RadCartesianChart.VerticalAxis>

    <telerik:AreaSeries ShowLabels="True">
        <telerik:AreaSeries.PointTemplate>
            <DataTemplate>
                <Ellipse Height="8" Width="8"
                            Fill="White"
                            Stroke="{Binding ElementName=RadChart1, Path=Palette.GlobalEntries[0].Fill}" />
            </DataTemplate>
        </telerik:AreaSeries.PointTemplate>

        <telerik:AreaSeries.DataPoints>
            <telerik:CategoricalDataPoint Category="A" Value="1" />
            <telerik:CategoricalDataPoint Category="B" Value="2" />
            <telerik:CategoricalDataPoint Category="C" Value="3" />
            <telerik:CategoricalDataPoint Category="D" Value="1" />
            <telerik:CategoricalDataPoint Category="E" Value="3" />
            <telerik:CategoricalDataPoint Category="F" Value="2" />
            <telerik:CategoricalDataPoint Category="G" Value="1" />
        </telerik:AreaSeries.DataPoints>
    </telerik:AreaSeries>

</telerik:RadCartesianChart>

Also, for Q3 2012 (scheduled around mid-October) we will be introducing support for custom annotations so you will be able to overlay any FrameworkElement on a custom location inside the plot area.

Hope this helps.


Regards,
Giuseppe
the Telerik team

[Andrew]

Thanks for the help. How could I mark a single data point using c# with only having access to the area series in which the point belongs to?

[Giuseppe]

Hello Andrew,

You can achieve the desired functionality like this:

public MainPage()
{
    InitializeComponent();

    RadChart1.Loaded += new RoutedEventHandler(RadChart1_Loaded);
}

private void RadChart1_Loaded(object sender, RoutedEventArgs e)
{
    Dispatcher.BeginInvoke(() =>
        {
            // Get the data point you want to mark.
            CategoricalDataPoint dataPoint = (RadChart1.Series[0] as AreaSeries).DataPoints[3];

            // Find the corresponding visual by its DataContext property.
            var ellipsePresenter = RadChart1.ChildrenOfType<ContentPresenter>().Where(presenter => presenter.Opacity != 0 && presenter.DataContext == dataPoint).SingleOrDefault();
            if (ellipsePresenter != null)
            {
                ellipsePresenter.ChildrenOfType<Ellipse>().Single().Fill = new SolidColorBrush(Colors.Red);
            }
        });
}

Hope this helps.


Kind regards,
Giuseppe
the Telerik team