none
wpf toolkit Chart使用での表現について RRS feed

  • 質問

  • お世話になります。

    wpf toolkitのChartControlを使い、グラフ(LineSeries)を作成したいのですが、次のような表現は出来るのでしょうか?
    XAMLの記述で作成できるのでしょうか?
    調べているのですが、wpf toolkit Chartの情報が少なく困っております。
    何か方法がありましたら教えて頂けると助かります。

    1.X軸に時間をY軸に値を表現したいのですが、時間軸に日付+時間(2009/11/11 11:11:11など)を表示したい。
    2.時間軸に日付+時間(2009/11/11 11:11:11など)を縦に表示したい。
      下記のようにX軸に対して右上がりで表示したい。下記"/"部分に日時表示(わかりにくくて申し訳ないです)

       -+-+-+-+-+-------X
        / / / / /

    [C#]
        Chart1.DataContext = new KeyValuePair<DateTime, double>[]
        {
            new KeyValuePair<DateTime, double>(DateTime.Parse("2009/11/11 11:11:11"), 784),
            new KeyValuePair<DateTime, double>(DateTime.Parse("2009/11/11 12:11:11"), 590),
            new KeyValuePair<DateTime, double>(DateTime.Parse("2009/11/11 15:30:11"), 800),
            new KeyValuePair<DateTime, double>(DateTime.Parse("2009/11/11 19:15:11"), 264),
            new KeyValuePair<DateTime, double>(DateTime.Parse("2009/11/11 20:13:11"), 587),
            new KeyValuePair<DateTime, double>(DateTime.Parse("2009/11/11 23:50:11"), 483),
            new KeyValuePair<DateTime, double>(DateTime.Parse("2009/11/12 11:11:11"), 300)
        };

    [XAML]
    <Window x:Class="ChartTest.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:chartingToolkit="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit" xmlns:Custom="http://schemas.microsoft.com/wpf/2008/toolkit"
        x:Name="Window"
        Title="MainWindow"
        Width="640" Height="480">

        <Grid x:Name="LayoutRoot">
            <chartingToolkit:Chart Margin="12.5,8,215.5,8" Title="Chart Title" RenderTransformOrigin="0.372,0.525" x:Name="Chart1" >

                <chartingToolkit:Chart.Series>
                    <chartingToolkit:LineSeries ItemsSource="{Binding}"
                        DependentValuePath="Value"
                        IndependentValuePath="Key"
                        Title="Value" IsSelectionEnabled="True"  />
                </chartingToolkit:Chart.Series>
            </chartingToolkit:Chart>
        </Grid>
    </Window>

    以上、よろしくお願い致します。
    2009年11月12日 11:30

回答

  • 再度調整してみました。

    <Window
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:chartingToolkit="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit"
    	x:Class="WpfChartAxis.Window1"
        Title="Window1" Height="480" Width="640"
        >
    	<Window.Resources>
    		<Style x:Key="DateTimeAxisLabelStyle1" TargetType="{x:Type chartingToolkit:DateTimeAxisLabel}">
    			<Setter Property="StringFormat" Value="{}{0:yyyy/mm/dd hh:MM}"/>
    			<Setter Property="RenderTransform">
    				<Setter.Value>
    					<TransformGroup>
    						<ScaleTransform/>
    						<SkewTransform/>
    						<RotateTransform Angle="315"/>
    						<TranslateTransform Y="70"/>
    					</TransformGroup>
    				</Setter.Value>
    			</Setter>
    		</Style>
    	</Window.Resources>
       <Grid>
        <chartingToolkit:Chart Margin="0" x:Name="Chart1">
        	<chartingToolkit:LineSeries ItemsSource="{Binding}" 
        		DependentValuePath="Value" 
        		IndependentValuePath="Key"
        		Title="Value" IsSelectionEnabled="True"  />
    		<chartingToolkit:Chart.Axes>
            	<chartingToolkit:LinearAxis Orientation="Y"/>
            	<chartingToolkit:DateTimeAxis Orientation="X" AxisLabelStyle="{DynamicResource DateTimeAxisLabelStyle1}" Height="80"/>
        </chartingToolkit:Chart.Axes>
        </chartingToolkit:Chart>
      </Grid>
    </Window>

    えムナウ@わんくま同盟 Microsoft MVP Visual Studio C# Since 2005/01-2009/12
    • 回答としてマーク kmo3 2009年11月16日 11:17
    2009年11月13日 7:20

すべての返信

  • やってみましたがこんなんで精一杯でした。

    <Window
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:chartingToolkit="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit"
         xmlns:visualizationToolkit="clr-namespace:System.Windows.Controls.DataVisualization;assembly=System.Windows.Controls.DataVisualization.Toolkit"
    	  x:Class="WpfChartAxis.Window1"
        Title="Window1" Height="480" Width="640"
         >
    	<Window.Resources>
    		<Style x:Key="DateTimeAxisLabelStyle1" TargetType="{x:Type chartingToolkit:DateTimeAxisLabel}">
    			<Setter Property="StringFormat" Value="{}{0:yyyy/MM/dd hh:mm}"/>
    			<Setter Property="RenderTransformOrigin" Value="0.5,0.5"/>
    			<Setter Property="LayoutTransform">
    				<Setter.Value>
    					<TransformGroup>
    						<ScaleTransform/>
    						<SkewTransform/>
    						<RotateTransform Angle="315"/>
    						<TranslateTransform/>
    					</TransformGroup>
    				</Setter.Value>
    			</Setter>
    		</Style>
    	</Window.Resources>
       <Grid>
        <chartingToolkit:Chart Margin="0" x:Name="Chart1">
        	<chartingToolkit:LineSeries ItemsSource="{Binding}" 
        		DependentValuePath="Value" 
        		IndependentValuePath="Key"
        		Title="Value" IsSelectionEnabled="True"  />
    		<chartingToolkit:Chart.Axes>
            	<chartingToolkit:LinearAxis Orientation="Y"/>
            	<chartingToolkit:DateTimeAxis Orientation="X" AxisLabelStyle="{DynamicResource DateTimeAxisLabelStyle1}"/>
        </chartingToolkit:Chart.Axes>
        </chartingToolkit:Chart>
      </Grid>
    </Window>
    

    えムナウ@わんくま同盟 Microsoft MVP Visual Studio C# Since 2005/01-2009/12
    2009年11月13日 7:05
  • 再度調整してみました。

    <Window
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:chartingToolkit="clr-namespace:System.Windows.Controls.DataVisualization.Charting;assembly=System.Windows.Controls.DataVisualization.Toolkit"
    	x:Class="WpfChartAxis.Window1"
        Title="Window1" Height="480" Width="640"
        >
    	<Window.Resources>
    		<Style x:Key="DateTimeAxisLabelStyle1" TargetType="{x:Type chartingToolkit:DateTimeAxisLabel}">
    			<Setter Property="StringFormat" Value="{}{0:yyyy/mm/dd hh:MM}"/>
    			<Setter Property="RenderTransform">
    				<Setter.Value>
    					<TransformGroup>
    						<ScaleTransform/>
    						<SkewTransform/>
    						<RotateTransform Angle="315"/>
    						<TranslateTransform Y="70"/>
    					</TransformGroup>
    				</Setter.Value>
    			</Setter>
    		</Style>
    	</Window.Resources>
       <Grid>
        <chartingToolkit:Chart Margin="0" x:Name="Chart1">
        	<chartingToolkit:LineSeries ItemsSource="{Binding}" 
        		DependentValuePath="Value" 
        		IndependentValuePath="Key"
        		Title="Value" IsSelectionEnabled="True"  />
    		<chartingToolkit:Chart.Axes>
            	<chartingToolkit:LinearAxis Orientation="Y"/>
            	<chartingToolkit:DateTimeAxis Orientation="X" AxisLabelStyle="{DynamicResource DateTimeAxisLabelStyle1}" Height="80"/>
        </chartingToolkit:Chart.Axes>
        </chartingToolkit:Chart>
      </Grid>
    </Window>

    えムナウ@わんくま同盟 Microsoft MVP Visual Studio C# Since 2005/01-2009/12
    • 回答としてマーク kmo3 2009年11月16日 11:17
    2009年11月13日 7:20
  • えムナウ様

    お世話になります。

    ありがとうございます。
    大変参考になりました。

    XAML難しいですね・・。
    みなさん、Styleの書き方、何が設定できるかなど、どうやって学ばれてるのでしょう?
    本も見当たらないですし、ネットの情報も少ない気がします。
    私の探し方が悪いのかもしれませんが・・。
    2009年11月16日 11:17