Series Selection and Selected Series Styling
Posted by Admin - on 13 February 2019 12:43 PM
|
|
BaseRenderableSeries.IsSelectedEach BaseRenderableSeries has the IsSelected property. When set to True, two things happen:
This allows us to do some things to change the visual appearance of RenderableSeries when selected. Styling the Selected SeriesTo set a SelectedSeriesStyle on a RenderableSeries, use the following XAML: <s:FastLineRenderableSeries> <s:FastLineRenderableSeries.SelectedSeriesStyle> <!-- When a series is selected, apply this style --> <!-- Changes SeriesColor to white on click --> <!-- Applies a PointMarker --> <Style TargetType="s:FastLineRenderableSeries"> <Setter Property="Stroke" Value="White" /> <Setter Property="PointMarkerTemplate"> <Setter.Value> <!-- This is how we do PointMarkerTemplates in Scichart v2.0. You can either declare an EllipsePointMarker inline, --> <!-- or, if templating (because you are sharing a style across many series), then use a ControlTemplate with a BasePointMarker, --> <!-- or UIElement to replicate across each data-point --> <ControlTemplate> <s:EllipsePointMarker Fill="#FF00DC" Stroke="White" Width="7" Height="7"/> </ControlTemplate> </Setter.Value> </Setter> </Style> </s:FastLineRenderableSeries.SelectedSeriesStyle> </s:FastLineRenderableSeries> Now, whenever the IsSelected property is set on this RenderableSeries, then the SelectedSeriesStyle above will be applied, in this case, changing its Stroke and applying a PointMarker. Using the SeriesSelectionModifierAlso it is possible to set the style only once in the SeriesSelectionModifier using the SelectedSeriesStyle property in more general cases (it will be applied to all series): <s:SeriesSelectionModifier> <s:SeriesSelectionModifier.SelectedSeriesStyle> <!-- This style will be applied to all RenderableSeries --> <Style TargetType="s:BaseRenderableSeries"> <Setter Property="Stroke" Value="White" /> </Style> </s:SeriesSelectionModifier.SelectedSeriesStyle> </s:SeriesSelectionModifier> Notice, that SelectedSeriesStyle from modifier has lower priority than its counterpart from the RenderableSeries, so any style explicitly set on the RenderableSeries will override the one from modifier. This will result in the following visual appearance when a series is selected: Complete Example on SeriesSelectionModifierThere is an example in the SciChart Examples Suite which shows how to combine the SeriesSelectionModifier with the BaseRenderableSeries.SelectedSeriesStyle property to automatically enable mouse-click selection. In the demo, it can be found at Tooltips and Hit-Test -> Series Selection. Full source code of the example can be found online at this link. Further ReadingIf you want to create a Custom Chart Modifier to perform selection, e.g. on mouse-over, then you can use our Hit-Test API. For more information about Series Selection in SciChart, please see the following documentation articles: | |
|