[Solved] Selected points not changing appearance in RadCartesianChart

[Ken]

I have a radcartesianchart with the items data source in my viewmodel.

I'm trying to get the chart to respond visually to a point selection. When I set a breakpoint on the RadChart1_SelectionChanged event and count the selected points its obviously adding points to the selection series. I'm using the selection changed event handler exactly as in the ChartView samples. I may just be mixing up point templates with pallettes as I don't really get which is applied where. Thanks for any help.

  

<telerik:RadCartesianChart Grid.Row="1" HorizontalAlignment="Left" Margin="41,22,0,0" Name="radCartesianChart1" VerticalAlignment="Top" Height="343" Width="769">
    <telerik:RadCartesianChart.HorizontalAxis>
        <telerik:LinearAxis/>
    </telerik:RadCartesianChart.HorizontalAxis>
    <telerik:RadCartesianChart.VerticalAxis>
        <telerik:LinearAxis />
    </telerik:RadCartesianChart.VerticalAxis>

    <telerik:RadCartesianChart.Behaviors>
        <telerik:ChartSelectionBehavior  DataPointSelectionMode="Multiple"
                                         HitTestMargin="10"
                                         SelectionChanged="RadChart1_SelectionChanged"
                                         />
    </telerik:RadCartesianChart.Behaviors>

    <telerik:RadCartesianChart.SelectionPalette>
        <telerik:ChartPalette>
            <telerik:ChartPalette.SeriesEntries>
                <telerik:PaletteEntryCollection SeriesFamily="Scatter">
                     <telerik:PaletteEntry Fill="Red" />
                </telerik:PaletteEntryCollection>
            </telerik:ChartPalette.SeriesEntries>
        </telerik:ChartPalette>
    </telerik:RadCartesianChart.SelectionPalette>


    <telerik:ScatterPointSeries ItemsSource="{Binding Source={StaticResource myContext}, Path=ChangeStatsCollection}"
                                XValueBinding="PolyID"
                                YValueBinding="Acreage" BorderBrush="Black"
                                AllowSelect="True">
        <telerik:ScatterPointSeries.PointTemplate>
            <DataTemplate>
                <Ellipse  Width="5" Height="5"   Fill="Green"/>
            </DataTemplate>
        </telerik:ScatterPointSeries.PointTemplate>

    </telerik:ScatterPointSeries>

</telerik:RadCartesianChart>

 

 

 

private void RadChart1_SelectionChanged(object sender, ChartSelectionChangedEventArgs e)
     {
         if (e.AddedPoints.Count == 0)
             return;

         // Get the data point.
         var dataPoint = e.AddedPoints[0];
         int sPoints = radCartesianChart1.SelectedPoints.Count;
         // Get the series.
         ScatterPointSeries series = dataPoint.Presenter as ScatterPointSeries;


     }

[Ken]

I figured it out. The datapoint template was masking the selection pallette. I got rid of that, and it worked like the sample.

[Obalesu]

Hi,

I am using Line series Instead of ScatterPointSeries ,Can we the change the appearance(color) of selected points in radchartview(LineSeries).

Thanks & Regards
Obalesu.N

[Petar Kirov]

Hi,

This can be achieved by first defining a PointTemplate (so that you can actually select the point), and then in the SelectionChanged event handler getting the point's ContentPresenter.

Sample PointTemplate:

<telerik:LineSeries>
    <telerik:LineSeries.PointTemplate>
        <DataTemplate>
            <Ellipse Height="8" Width="8" Fill="Yellow"/>
        </DataTemplate>
    </telerik:LineSeries.PointTemplate>
</telerik:LineSeries>

Attaching an event handler:

<telerik:RadCartesianChart.Behaviors>
    <telerik:ChartSelectionBehavior DataPointSelectionMode="Single"
                    SelectionChanged="chartView_SelectionChanged"/>
</telerik:RadCartesianChart.Behaviors>

And the event handler:

private void chartView_SelectionChanged(object sender, ChartSelectionChangedEventArgs e)
{
    //Handle de-selection of the current point
    if (e.RemovedPoints.Count > 0)
    {
        var removedPoint = e.RemovedPoints[0];
        var series = removedPoint.Presenter as LineSeries;
        var pointPresenter = series.
            ChildrenOfType<ContentPresenter>().
            Where(cp => cp.Tag == removedPoint).FirstOrDefault();
        var ellipseElement = pointPresenter.
            ChildrenOfType<Ellipse>().FirstOrDefault();

        //Do whatever you want with it :)
        ellipseElement.Fill = new SolidColorBrush(Colors.Yellow);
    }

    //Handle selection of the current point
    if (e.AddedPoints.Count > 0)
    {
        var addedPoint = e.AddedPoints[0];
        var series = addedPoint.Presenter as LineSeries;
        var pointPresenter = series.
            ChildrenOfType<ContentPresenter>().
            Where(cp => cp.Tag == addedPoint).FirstOrDefault();
        var ellipseElement = pointPresenter.
            ChildrenOfType<Ellipse>().FirstOrDefault();

        //Do whatever you want with it :)
        ellipseElement.Fill = new SolidColorBrush(Colors.Red);
    }
}

Regards,
Petar Kirov
the Telerik team

[AKROS]

Hi Petar,

I tested the code above but it doesn't work (even with the latest internal build).
The compiler says that the ChildrenOfType<T> doesn't exist on the LineSeries object.

Any advice?
Cheers,

Nicolas

[Petar Kirov]

Hi Nicolas,

I believe that your problem is that you are missing a "using ..." in code-behind. Adding this should solve your issue:


using Telerik.Windows.Controls;

Regards,
Petar Kirov
the Telerik team

[Remco]

Hello,

I also use line series. I only want to allow selection of the entire series, not of individual datapoints. So I do not want to set a point template. I want to allow selection of an entire series to provide a context menu to allow the user to remove the entire series from the chart. To make it clear for which series the context menu appears I want to select the series. I want to change the appearance of the selected series by doubling its stroke thickness and obviously restore the original stroke thickness on deselection. Clicking elsewhere on the chart should deselect any series. How can I make this work? I noticed the ChartSeries class has AllowSelect and IsSelected properties, but I'm not sure how to change the stroke thickness on selection.

Remco

[AKROS]

Thanks Petar, it solves my issue.
Greetings,

Nicolas

[hart]

Petar -- that is not working for me...
I have the -- using-- clause in my code behind  - and still getting errors for both ChildrenOfType and FindChildControl

I am using...
C:\Program Files (x86)\Telerik\RadControls for Silverlight Q2 2013\Binaries\Silverlight\Telerik.Windows.Controls.dll
version 5.0.5.0

Other items missing...
UpdateLayout,
ItemsSource
FindChildByType,

[Milena]

Hi Hart,

I was following the steps of my colleague Petar and made a sample project - by me it's working correct (you can see the attached file).

So, I suggest you to see if you have referenced all the needed dll-s. For the ChartView you should use: Telerik.Windows.Controls.Chart, Telerik.Windows.Data and Telerik.Windows.Controls. (Here you can see each control in which assembly is). Then try to clean and rebuild the solution and I hope that there will be no more errors. 

Greetings,

Milena
the Telerik team