Scrollen X Achse Plot Bereich - Silverlight Spalte Serie

Question

Ich habe eine Spalte Serie Diagramm, das funktioniert gut.

Ich habe eine Funktion, die ich hinzufügen muss, ich möchte die horizontale Scroll aktiviert werden, um den Diagrammbereich, der X-Achse ist. Hier

ist der Screenshot:

Wenn Sie den Screenshot sehen, ich habe sechs Punkte, und die Bar sind sehr dünn, weil mehr Anzahl der Elemente, so nehme an, wenn ich 20 Produkte haben dann werden die Balken überhaupt nicht sichtbar sein.

Also können wir den X-Achsenbalken horizontal scrollbar machen?

EDIT

ResourceDictionary.xaml

<ResourceDictionary 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:convertor="clr-namespace:ChartingDV.Provider" 
    xmlns:datavis="clr-namespace:System.Windows.Controls.DataVisualization;assembly=System.Windows.Controls.DataVisualization.Toolkit" 
    xmlns:charting="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit" 
    xmlns:chartingprimitives="clr-namespace:System.Windows.Controls.DataVisualization.Charting.Primitives;assembly=System.Windows.Controls.DataVisualization.Toolkit"> 

    <ControlTemplate x:Key="PhoneChartPortraitTemplate" TargetType="charting:Chart"> 
     <Grid> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="Auto"/> 
       <RowDefinition Height="*"/> 
       <RowDefinition Height="Auto"/> 
      </Grid.RowDefinitions> 
      <datavis:Title 
       Content="{TemplateBinding Title}" 
       Style="{TemplateBinding TitleStyle}"/> 
      <datavis:Legend x:Name="Legend" 
       Grid.Row="2" 
       Header="{TemplateBinding LegendTitle}" 
       Style="{TemplateBinding LegendStyle}"> 
       <datavis:Legend.ItemsPanel> 
        <ItemsPanelTemplate> 
         <StackPanel Orientation="Horizontal"/> 
        </ItemsPanelTemplate> 
       </datavis:Legend.ItemsPanel> 
       <datavis:Legend.Template> 
        <ControlTemplate TargetType="datavis:Legend"> 
         <Grid> 
          <Grid.RowDefinitions> 
           <RowDefinition Height="Auto" /> 
           <RowDefinition /> 
          </Grid.RowDefinitions> 
          <ScrollViewer 
            Grid.Row="1" 
            HorizontalScrollBarVisibility="Auto" 
            VerticalScrollBarVisibility="Disabled" 
            BorderThickness="0" 
            Padding="0" 
            IsTabStop="False"> 
           <ItemsPresenter 
             x:Name="Items" 
             Margin="10,0,10,10"/> 
          </ScrollViewer> 
         </Grid> 
        </ControlTemplate> 
       </datavis:Legend.Template> 
      </datavis:Legend> 
      <chartingprimitives:EdgePanel 
       Grid.Column="0" 
       Grid.Row="1" 
       x:Name="ChartArea" 
       Style="{TemplateBinding ChartAreaStyle}"> 
       <Grid 
        Canvas.ZIndex="-1" 
        Style="{TemplateBinding PlotAreaStyle}" /> 
      </chartingprimitives:EdgePanel> 
     </Grid> 
    </ControlTemplate> 

    <!-- Chart Style for Phone --> 
    <Style x:Key="PhoneChartStyle" TargetType="charting:Chart"> 
     <Setter Property="IsTabStop" Value="False" /> 
     <Setter Property="Padding" Value="10" /> 
     <Setter Property="Palette"> 
      <Setter.Value> 
       <datavis:ResourceDictionaryCollection> 
        <!-- Blue --> 
        <ResourceDictionary> 
         <SolidColorBrush x:Key="Background" Color="#E85F3D"/> 
         <Style x:Key="DataPointStyle" TargetType="Control"> 
          <Setter Property="Background" Value="{StaticResource Background}" /> 
         </Style> 
         <Style x:Key="DataShapeStyle" TargetType="Shape"> 
          <Setter Property="Stroke" Value="{StaticResource Background}" /> 
          <Setter Property="StrokeThickness" Value="2" /> 
          <Setter Property="StrokeMiterLimit" Value="1" /> 
          <Setter Property="Fill" Value="{StaticResource Background}" /> 
         </Style> 
        </ResourceDictionary> 
        <!-- Red --> 
        <ResourceDictionary> 
         <SolidColorBrush x:Key="Background" Color="#76D164"/> 
         <Style x:Key="DataPointStyle" TargetType="Control"> 
          <Setter Property="Background" Value="{StaticResource Background}" /> 
         </Style> 
         <Style x:Key="DataShapeStyle" TargetType="Shape"> 
          <Setter Property="Stroke" Value="{StaticResource Background}" /> 
          <Setter Property="StrokeThickness" Value="2" /> 
          <Setter Property="StrokeMiterLimit" Value="1" /> 
          <Setter Property="Fill" Value="{StaticResource Background}" /> 
         </Style> 
        </ResourceDictionary> 
        <!-- Light Green --> 
        <ResourceDictionary> 
         <SolidColorBrush x:Key="Background" Color="#648ED1"/> 
         <Style x:Key="DataPointStyle" TargetType="Control"> 
          <Setter Property="Background" Value="{StaticResource Background}" /> 
         </Style> 
         <Style x:Key="DataShapeStyle" TargetType="Shape"> 
          <Setter Property="Stroke" Value="{StaticResource Background}" /> 
          <Setter Property="StrokeThickness" Value="2" /> 
          <Setter Property="StrokeMiterLimit" Value="1" /> 
          <Setter Property="Fill" Value="{StaticResource Background}" /> 
         </Style> 
        </ResourceDictionary> 
       </datavis:ResourceDictionaryCollection> 
      </Setter.Value> 
     </Setter> 
     <Setter Property="LegendStyle"> 
      <Setter.Value> 
       <Style TargetType="datavis:Legend"> 
        <Setter Property="HorizontalAlignment" Value="Center"/> 
        <Setter Property="VerticalAlignment" Value="Center"/> 
        <Setter Property="BorderBrush" Value="{StaticResource PhoneForegroundBrush}"/> 
        <Setter Property="Margin" Value="20"/> 
       </Style> 
      </Setter.Value> 
     </Setter> 
     <Setter Property="ChartAreaStyle"> 
      <Setter.Value> 
       <Style TargetType="Panel"> 
        <Setter Property="MinWidth" Value="100" /> 
        <Setter Property="MinHeight" Value="75" /> 
       </Style> 
      </Setter.Value> 
     </Setter> 
     <Setter Property="PlotAreaStyle"> 
      <Setter.Value> 
       <Style TargetType="Grid"> 
        <Setter Property="Background" Value="Transparent"/> 
       </Style> 
      </Setter.Value> 
     </Setter> 
     <Setter Property="Template" Value="{StaticResource PhoneChartPortraitTemplate}"/> 
    </Style> 

</ResourceDictionary> 

In der XAML-Datei:

<charting:Chart Name="barChart" 
    Style="{StaticResource PhoneChartStyle}" 
    Template="{StaticResource PhoneChartPortraitTemplate}"> 
    <charting:Chart.Series> 
     <charting:ColumnSeries 
      Title="Incorrect" 
      IndependentValueBinding="{Binding Key}" 
      DependentValueBinding="{Binding Value}" 
      AnimationSequence="Simultaneous"> 
     </charting:ColumnSeries> 
     <charting:ColumnSeries     
      Title="Correct" 
      IndependentValueBinding="{Binding Key}" 
      DependentValueBinding="{Binding Value}" 
      AnimationSequence="Simultaneous"> 
     </charting:ColumnSeries> 
     <charting:ColumnSeries     
      Title="Skipped" 
      IndependentValueBinding="{Binding Key}" 
      DependentValueBinding="{Binding Value}" 
      AnimationSequence="Simultaneous"> 
     </charting:ColumnSeries> 
    </charting:Chart.Series> 
</charting:Chart> 

Answer 1

Schließlich habe ich es gelöst, aber ich habe keine Änderungen an den APIs nicht gemacht, Stattdessen habe ich den folgenden Ansatz verfolgt.

1) Wir haben die Möglichkeit, das gesamte Diagramm zu scrollen.

2) Lassen Sie das gesamte Balkendiagramm durchblättern und entfernen Sie dann die Werte Y axis.

3) Erstellen Sie jetzt ein Dummy-Layout mit Y axis values mit Grid row definitions. Dies wird Ihr Stamm Grid.

4) Platzieren Sie nun innerhalb des Grundrasters das Diagrammraster.

5) Jetzt, wenn Sie n keine Tests nehmen, können Sie das Diagramm scrollen, aber Ihr Dummy-Layout mit Y axis Werte bleibt konstant wie es ist, so für den Benutzer sieht es aus wie die Balken scrollen.

Enjoy :)