SciChart® the market leader in Fast WPF Charts, WPF 3D Charts, and now iOS Charting & Android Chart Components

1
0

Hi Guys,

I am using a Data Template to display charts in an Items Control. The template displays the charts correctly but the Modifier group in the chart modifier of the template is not working correctly.

The IsEnabled property of each modifier is bound to a ChartModifier Property in the parent view model for the ItemsControl which then needs to be converted to a boolean as per the SciChart Trader example.

As you can see from the code below I have inserted a textblock element to test the conversion and the binding. The ChartModifier for the parent viewmodel is initialized to “ZoomPan”. When run the template correctly displays “False” in the textblock but none of the converter calls fire from the ModifierGroup leaving each chart with all 4 modifiers active at the same time.

Any thoughts as to possible causes/cures would be much appreciated

Regards
Ian Carson

        <DataTemplate x:Key="ChartTemplate">
            <Grid Margin="0"
                  HorizontalAlignment="Stretch"
                  VerticalAlignment="Stretch"
                  Height="400">
                <Grid.RowDefinitions>
                    <RowDefinition Height="30"/>
                    <RowDefinition Height="3*" />
                    <RowDefinition Height="Auto" />
                    <RowDefinition Height="*" />
                </Grid.RowDefinitions>
                <TextBlock Text="{Binding Path=DataContext.ChartModifier,  Converter={StaticResource IsModifierTypeConverter}, ConverterParameter=Rollover, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type explorer:PriceGraphShapeView}}, Mode=TwoWay }"/>
                <visuals:SciStockChart Grid.Row="1"
                                       Margin="0"
                                       x:Name="PriceChart"
                                       SeriesSource="{Binding Path=PriceChartAndOverlaySeries}"
                                       visuals:ThemeManager.Theme="BlackSteel"
                                       visuals:SciChartGroup.VerticalChartGroup="{Binding VerticalGroupID}"
                                       DrawMinorGridLines="False"
                                       DrawMajorGridLines="True"
                                       XAxisTextFormatting="dd MMM yyyy"
                                       YAxisTextFormatting="0.00">
                    <visuals:SciChartSurface.XAxis>
                        <visuals:CategoryDateTimeAxis DrawMajorBands="True"
                                                      GrowBy="0.0, 0.1" />
                    </visuals:SciChartSurface.XAxis>
                    <visuals:SciStockChart.ChartModifier>
                        <visuals:ModifierGroup visuals:MouseManager.MouseEventGroup="{Binding MouseGroupID}">
                            <visuals:RolloverModifier  IsEnabled="{Binding Path=DataContext.ChartModifier,  Converter={StaticResource IsModifierTypeConverter}, ConverterParameter=Rollover, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type explorer:PriceGraphShapeView}}, Mode=TwoWay }"
                                                      ReceiveHandledEvents="True" />
                            <visuals:ZoomPanModifier IsEnabled="{Binding Path=DataContext.ChartModifier, Converter={StaticResource IsModifierTypeConverter}, ConverterParameter=ZoomPan, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type explorer:PriceGraphShapeView}} , Mode=TwoWay }"
                                                     XyDirection="XDirection"
                                                     ReceiveHandledEvents="True" />
                            <visuals:CursorModifier IsEnabled="{Binding Path=DataContext.ChartModifier, Converter={StaticResource IsModifierTypeConverter}, ConverterParameter=CrosshairsCursor, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type explorer:PriceGraphShapeView}}, Mode=TwoWay }"
                                                    ReceiveHandledEvents="True"
                                                    ShowAxisLabels="True"
                                                    ShowTooltip="False" />
                            <visuals:RubberBandXyZoomModifier IsEnabled="{Binding Path=DataContext.ChartModifier, Converter={StaticResource IsModifierTypeConverter}, ConverterParameter=RubberBandZoom, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type explorer:PriceGraphShapeView}}, Mode=TwoWay  }"
                                                              IsXAxisOnly="True"
                                                              IsAnimated="True"
                                                              ReceiveHandledEvents="True" />
                            <visuals:ZoomExtentsModifier ExecuteOn="MouseDoubleClick" />
                        </visuals:ModifierGroup>
                    </visuals:SciStockChart.ChartModifier>
                </visuals:SciStockChart>
                <uiServices:GridExpander Grid.Row="2"
                                         Margin="0"
                                         BorderBrush="#FF67777C"
                                         Height="10"
                                         Background="#FF67777C"
                                         HorizontalAlignment="Stretch"
                                         VerticalAlignment="Center"
                                         IsCollapsed="False"
                                         IsTabStop="False"
                                         Direction="Next" />
                <ItemsControl x:Name="IndicatorsContainer"
                              Grid.Row="3"
                              Margin="0"
                              Background="Aqua"
                              ItemsSource="{Binding Indicators}"
                              ItemTemplate="{StaticResource IndicatorTemplate}">
                    <ItemsControl.ItemsPanel>
                        <ItemsPanelTemplate>
                            <UniformGrid Columns="1"
                                         Background="Bisque" />
                        </ItemsPanelTemplate>
                    </ItemsControl.ItemsPanel>
                </ItemsControl>
            </Grid>
        </DataTemplate>
  • You must to post comments
3
0

Thanks for the pointers. They were enough to get me traveling in the right direction with this one.

The issue was the FindAncestor binding. However, rather than having to manage the changes down at the Data Template ViewModel level I found a very nice technique for passing the correct DataContext in the XAML. Here is is…

  1. Create a Binding Proxy
    public class BindingProxy : Freezable
    {
        protected override Freezable CreateInstanceCore()
        {
            return new BindingProxy();
        }

        public object Data
        {
            get { return GetValue(DataProperty); }
            set { SetValue(DataProperty, value); }
        }

        // Using a DependencyProperty as the backing store for Data.
        // This enables animation, styling, binding, etc...
        public static readonly DependencyProperty DataProperty = 
            DependencyProperty.Register("Data", typeof(object), 
            typeof(BindingProxy), new UIPropertyMetadata(null));
    }
  1. Declare it in the XAML and Bind its Data property to the context you need to reference
        <uiServices:BindingProxy x:Key="BindingProxy" Data="{Binding}"/>
  1. Use it to replace the FindAncestor binding
<visuals:RolloverModifier  IsEnabled="{Binding Path=Data.ChartModifier, Source={StaticResource BindingProxy},  Converter={StaticResource IsModifierTypeConverter}, ConverterParameter=Rollover, Mode=TwoWay }"

Hope this helps someone else.

Regards
Ian

  • Andrew
    Hmm yes, good idea! BindingProxy - also useful for DataGridColumns (which are not in the visual tree either). Thanks for sharing your solution!
  • Ian Carson
    That's no problem Andrew. Just contributing what I can. I'm sure we all appreciate the hard work you and the guys are putting into SciChart.Thanks.
  • You must to post comments
1
0

This issue occurred because Modifiers are not in the visual tree, therefore cannot accept ElementName or RelativeSource bindings.

I am told however by the team that from v3.1 onwards they have a workaround, ElementName and RelativeSource bindings for ChartModifier properties should work!

Hope this helps!
Andrew

  • You must to post comments
Showing 2 results
Your Answer

Please first to submit.