2011-07-19 27 views
4

WPFプロジェクトでSilverlight Toolkitを使用していますが、私が指定できるY軸の値で棒グラフに赤い水平線を追加したいと思います。チャートテンプレートを修正してラインを追加しましたが、私が望むy軸の値でラインを表示する方法とチャート全体に伸ばす方法をよく分かりません。ここで私がこれまで持っているグラフの画像です: enter image description hereSilverlightツールキットの縦棒グラフに水平線を追加する

、ここでは、私はそれを生成するために使用していますチャートテンプレートXAMLコードは次のとおりです。

  <charting:Chart Name="chartUsageHours" Grid.Column="1" BorderThickness="0" Padding="0" Loaded="chartUsageHours_Loaded"> 
      <charting:Chart.Template> 
       <ControlTemplate TargetType="{x:Type charting:Chart}"> 
        <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Padding="{TemplateBinding Padding}"> 
         <Grid> 
          <Grid.RowDefinitions> 
           <RowDefinition Height="Auto" /> 
           <RowDefinition Height="*" /> 
          </Grid.RowDefinitions> 
          <datavis:Title Content="{TemplateBinding Title}" Style="{TemplateBinding TitleStyle}" /> 
          <chartingprimitives:EdgePanel Name="ChartArea" Style="{TemplateBinding ChartAreaStyle}" Grid.Row="1" Margin="0,0,0,0"> 
           <Grid Panel.ZIndex="-1" Style="{TemplateBinding PlotAreaStyle}" /> 
           <Border Panel.ZIndex="10" BorderBrush="#FF919191" BorderThickness="1, 0, 0, 1" /> 
           <Grid Name="HoursThresholdContainer" Canvas.ZIndex="1" Background="Transparent"> 
            <Grid Name="HoursThreshold"> 
             <Line Name="Horizontal" HorizontalAlignment="Stretch" X1="0" Y1="100" X2="600" Y2="100" Stroke="Red" StrokeDashArray="4, 2"/> 
            </Grid> 
           </Grid> 
          </chartingprimitives:EdgePanel> 
         </Grid> 
        </Border> 
       </ControlTemplate> 
      </charting:Chart.Template> 
      <charting:Chart.Series> 
       <charting:StackedColumnSeries Visibility="{Binding Include_OnTimeVsFitTime, Converter={StaticResource BooleanToVisibilityConverter}}"> 
        <charting:StackedColumnSeries.IndependentAxis> 
         <charting:CategoryAxis Orientation="X" SortOrder="None" ShowGridLines="False"> 
          <charting:CategoryAxis.AxisLabelStyle> 
           <Style TargetType="charting:AxisLabel"> 
            <Setter Property="Template"> 
             <Setter.Value> 
              <ControlTemplate TargetType="charting:AxisLabel"> 
               <TextBlock Text="{Binding Converter={StaticResource DateStringConverter}}" FontSize="8"> 
                <TextBlock.LayoutTransform> 
                 <RotateTransform Angle="-90"/> 
                </TextBlock.LayoutTransform> 
               </TextBlock> 
              </ControlTemplate> 
             </Setter.Value> 
            </Setter> 
           </Style> 
          </charting:CategoryAxis.AxisLabelStyle> 
         </charting:CategoryAxis> 
        </charting:StackedColumnSeries.IndependentAxis> 
        <charting:SeriesDefinition ItemsSource="{Binding ChartUsageHours}" DependentValuePath="Value" IndependentValuePath="Key" /> 
        <charting:SeriesDefinition ItemsSource="{Binding ChartOnTimeHours}" DependentValuePath="Value" IndependentValuePath="Key" /> 
       </charting:StackedColumnSeries> 
       <charting:StackedColumnSeries Visibility="{Binding DontInclude_OnTimeVsFitTime, Converter={StaticResource BooleanToVisibilityConverter}}"> 
        <charting:SeriesDefinition ItemsSource="{Binding ChartUsageHours}" DependentValuePath="Value" IndependentValuePath="Key" /> 
       </charting:StackedColumnSeries> 
      </charting:Chart.Series> 
     </charting:Chart> 

誰もが行う方法についてのアイデアを持っていますこの?

あなたはそれがY軸に沿って整列させるためとして、全体の長さ

を伸ばす作るためにラインのStretch="Fill"を設定することができますおかげで、 ポール

答えて

5

ところで、どのような種類のシリーズ(Column、Bar、StackedColumnなど)でも動作する、より一般的なチャートを作成し、任意の値をラインとして表示します。

enter image description here

私は私のblog postにこのチャートの使い方を説明してきました。

hereソースコードをダウンロードできます。

+0

本当に素晴らしい仕事がvorrtex!私はあなたのコードをまだ見ていませんが、いくつかのことを学ぶのを楽しみにしています。 – PIntag

+0

私はあなたが私が使用していたよりも良い方法であるため、私はこれに対して私の受け入れられた答えを変更しました。ニースの解決策。 – PIntag

2

、私はY1/Y2プロパティへの結合のいずれかしようとするだろう、またはChartLine、あなたがCに必要となるラインのy位置を取得するには、その場所

+0

ありがとうございます、ストレッチ= "塗りつぶし"素晴らしいです。 Y1/Y2バインディングまでは、Y軸上の値を反映するようにバインドするのは正確ですか? – PIntag

+0

@PIntag表現するはずの赤線とは何ですか?それはデータに基づいたものか、XAMLで定義したい静的な値か、それとも何か他のものですか? – Rachel

+0

ご迷惑をお掛けして申し訳ありません。それはデータに基づく閾値である。たとえば、上に貼り付けたグラフの部分に、4.5時間の使用状況でその行を表示するように指定したいと思います。 LineオブジェクトのY1/Y2値は、Y軸上のデータ値ではなく、生の単位を表しているようです。 – PIntag

1

を設定するCanvas.Topを結合の両方を保持しているCanvasGridコントロールにラインを入れて

chart.Axes[1].GetPlotAreaCoordinate(value) // you could name your axis if you like. 
関連する問題