Настройка набора инструментов диаграмм WPF ColumnSeries (System. Windows .Controls.DataVisualization.Charting)

Question

Я использую набор инструментов для диаграмм WPF (System. Windows .Controls.DataVisualization.Charting). Все стили находятся в XAML, и я привязываю данные к диаграмме только из моей ViewModel. Все выглядит хорошо, когда я впервые нажимаю кнопку, чтобы отобразить серию столбцов. Когда я нажимаю кнопку второй раз, график становится больше / искажается; Показывает только часть графика.

График рисуется впервые:

И нажатие кнопки второй раз:

Я использую следующий код:

 <dvc:Chart Cursor="Cross"
               Background="#FFFFFCF2"
               Title="{Binding Title}"
               Height="410"
               Width="750"
               VerticalAlignment="Top"                   
               Name="ChartContainer">
      <dvc:Chart.Series>
        <dvc:ColumnSeries ItemsSource="{Binding ChartData,UpdateSourceTrigger=PropertyChanged}"
                          IndependentValueBinding="{Binding Path= Key}"
                          DependentValueBinding="{Binding Path= Value}"
                          Name="SummariesChart"
                          Margin="0,0,0,0" 
                          IsManipulationEnabled="False">             
          <dvc:ColumnSeries.DataPointStyle>
            <Style TargetType="dvc:ColumnDataPoint">
              <Setter Property="Template">
                <Setter.Value>
                  <ControlTemplate TargetType="dvc:ColumnDataPoint">
                    <Grid>
                      <Rectangle Fill="{TemplateBinding Background}"
                                 Stroke="Black" />
                      <Grid Margin="0,0, 0, 0"
                            HorizontalAlignment="Center"
                            VerticalAlignment="Top">
                        <TextBlock Text="{TemplateBinding FormattedDependentValue}"
                                   Margin="2" />
                      </Grid>
                    </Grid>
                  </ControlTemplate>
                </Setter.Value>
              </Setter>                  
            </Style>               
          </dvc:ColumnSeries.DataPointStyle>
        </dvc:ColumnSeries >
         </dvc:Chart.Series >
          <dvc:Chart.Axes>   
            <dvc:LinearAxis Orientation="X"
                        Title="{Binding XTitle}"                                  
                        Interval="1"
                        Location="Bottom"
                        ShowGridLines="True" />
             <dvc:LinearAxis Orientation="Y"
                        Title="{Binding YTitle}"
                        ShowGridLines="True"
                        Location="Left" />

       </dvc:Chart.Axes>
     </dvc:Chart>

Кроме того, чтобы дать вам полное представление, я использовал стиль в верхней части страницы, как показано ниже:

 <Style TargetType="dvc:Chart">
    <Setter Property="Template">
      <Setter.Value>
        <ControlTemplate TargetType="dvc:Chart">
          <Grid>
            <Grid.RowDefinitions>
              <RowDefinition Height="Auto" />
              <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <dv:Title Content="{TemplateBinding Title}"
                      Style="{TemplateBinding TitleStyle}"
                      Margin="1" />

            <Grid Grid.Row="1"
                  Margin="1,0,1,0">
              <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="Auto" />
              </Grid.ColumnDefinitions>
              <primitives:EdgePanel x:Name="ChartArea">
                <Grid Canvas.ZIndex="-1"
                      Style="{TemplateBinding PlotAreaStyle}" />
                <Border Canvas.ZIndex="10"
                        BorderBrush="#FF919191"
                        BorderThickness="1" />
              </primitives:EdgePanel>
            </Grid>
          </Grid>
        </ControlTemplate>
      </Setter.Value>
    </Setter>
  </Style>

  <Style x:Key="BarDataPointStyle"
         TargetType="{x:Type dvc:BarSeries}">
    <Setter Property="Background"
            Value="Blue"></Setter>
    <Setter Property="Opacity"
            Value="0" />
  </Style>

Когда я удаляю блок <dvc:Chart.Axes>, он стабильно работает корректно. Но мне нужны описания осей X и Y, существующие в этом блоке кода. Вы знаете, как я могу решить эту проблему? Я ценю вашу помощь.

Answer 1

Я нашел способ решить проблему. Но все же я скептически отношусь к тому, что со стилем что-то не так.

Я добавил Minimum = 0 и Maximum в теге LinearAxis. Я ограничил Максимум переменной в моей ViewModel. Я получил длину массива и добавил единицу к максимальной переменной (MaxNumberInXAxes).

<dvc:LinearAxis Orientation="X"
                        Title="{Binding XTitle}"                                  I 
                        nterval="{Binding XAxisInterval}"
                        Location="Bottom"
                        ShowGridLines="True"
                        AllowDrop="False"
                        Minimum="0"
                        Maximum="{Binding MaxNumberInXAxes}"/> 

График выглядит примерно так: