Sign in to follow this  
Followers 0
JuanC

Hiding series using the Legend Box

3 posts in this topic

If you have a chart with multiple series and need to provide UI to show/hide series, you can use styling on the legend box items to display a checkbox for each series.

[color= red]xmlns[/color][color= blue]:[/color][color= red]cfxConverters[/color][color= blue]="http://schemas.softwarefx.com/chartfx/wpf/80/converters"[/color]
[color= blue]<[/color][color= #a31515]DataTemplate [/color][color= red]x[/color][color= blue]:[/color][color= red]Key[/color][color= blue]="CheckLegend">  <[/color][color= #a31515]DataTemplate.Resources[/color][color= blue]>    <[/color][color= #a31515]cfxConverters[/color][color= blue]:[/color][color= #a31515]VisibilityToBooleanConverter [/color][color= red]x[/color][color= blue]:[/color][color= red]Key[/color][color= blue]="VisibilityToBool"          [/color][color= red]FalseVisibility[/color][color= blue]="Hidden"/>  </[/color][color= #a31515]DataTemplate.Resources[/color][color= blue]>  <[/color][color= #a31515]Grid[/color][color= blue]>    <[/color][color= #a31515]Grid.ColumnDefinitions[/color][color= blue]>      <[/color][color= #a31515]ColumnDefinition [/color][color= red]Width[/color][color= blue]="Auto" />      <[/color][color= #a31515]ColumnDefinition [/color][color= red]Width[/color][color= blue]="Auto" />      <[/color][color= #a31515]ColumnDefinition [/color][color= red]Width[/color][color= blue]="*" />    </[/color][color= #a31515]Grid.ColumnDefinitions[/color][color= blue]>    <[/color][color= #a31515]CheckBox [color= red]Margin[/color][color= blue]="2,0" [color= red]VerticalAlignment[/color][color= blue]="Center"       [/color][/color][/color][color= red]IsChecked[/color][color= blue]="{[/color][color= #a31515]Binding [/color][color= red]Path[/color][color= blue]=Visibility,                          [/color][color= red]Converter[/color][color= blue]={[/color][color= #a31515]StaticResource [/color][color= red]VisibilityToBool[/color][color= blue]}}" [/color][color= blue]/>    <[/color][color= #a31515]Rectangle [/color][color= red]Stroke[/color][color= blue]="{[/color][color= #a31515]Binding [/color][color= red]Path[/color][color= blue]=Stroke}" [/color][color= red]Fill[/color][color= blue]="{[/color][color= #a31515]Binding [/color][color= red]Path[/color][color= blue]=Fill}"       [/color][color= red]Grid.Column[/color][color= blue]="1" [/color][color= red]Width[/color][color= blue]="12" [/color][color= red]Height[/color][color= blue]="12" [/color][color= red]VerticalAlignment[/color][color= blue]="Center"       [/color][color= red]Margin[/color][color= blue]="2,0" />    <[/color][color= #a31515]TextBlock [/color][color= red]FontFamily[/color][color= blue]="{[/color][color= #a31515]Binding [/color][color= red]Path[/color][color= blue]=FontFamily}"        [/color][color= red]FontSize[/color][color= blue]="{[/color][color= #a31515]Binding [/color][color= red]Path[/color][color= blue]=FontSize}" [/color][color= red]Text[/color][color= blue]="{[/color][color= #a31515]Binding [/color][color= red]Path[/color][color= blue]=Text}"        [/color][color= red]Grid.Column[/color][color= blue]="2" [/color][color= red]VerticalAlignment[/color][color= blue]="Center" [/color][color= red]Margin[/color][color= blue]="2,0" />  </[/color][color= #a31515]Grid[/color][color= blue]></[/color][color= #a31515]DataTemplate[/color][color= blue]>[/color]

Unfortunately templating items in the legend box has to be done in the code because of our API so we need to add the following line of code to our Window/Page Loaded event (we expect to support a XAML way to set these templates in future builds but you know what they say

Share this post


Link to post
Share on other sites
Sign in to follow this  
Followers 0