FlexChart for WPF
データソースを使用したデータの連結

データを連結するということは、1 つ以上のデータコンシューマーをデータプロバイダに同期して接続するということです。データが連結されると、グラフは、連結されたすべてのデータを指定された系列のデータソースとして使用し、系列とグラフプロパティに従ってデータをグラフ面上に表現します。

データソースの内容と実際のグラフの間には少し距離があるため、データを集約しないとプロットできないことがよくあります。ただし、プロットするデータが既にデータビューや別のデータソースオブジェクトとして用意されていることもあります。その場合は、グラフを直接データソースオブジェクトに連結できます。

FlexChart コントロールをデータソースに連結するには、まず ItemsSource プロパティをデータソースオブジェクトに設定する必要があります。 次に、グラフの各系列をデータソースオブジェクト内のフィールドに連結する必要があります。それには、BindingX プロパティと Binding プロパティを使用します。

連結ソースを指定するには、DataContext = "{Binding RelativeSource={RelativeSource Mode=Self}}" マークアップを MainWindow.xaml ファイルの <Window> タグに追加する必要があります。

以下のコードは、DataCreator クラスを使用してグラフのデータを生成します。

次のコードはデータ連結を実装して完全に機能するプログラムの具体例になります。

<Window
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:Data_Binding"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:Chart="using:C1.Xaml.Chart" 
        xmlns:Xaml="using:C1.Xaml"
        xmlns:c1="http://schemas.componentone.com/winfx/2006/xaml" 
        xmlns:local1="clr-namespace:Data_Binding" 
        x:Name="window" 
        x:Class="Data_Binding.MainWindow"
        DataContext="{Binding RelativeSource={RelativeSource Mode=Self}}"
        mc:Ignorable="d">
   
    <Grid>

        <c1:C1FlexChart x:Name="flexChart" 
                        BindingX="Fruit" 
                        ItemsSource="{Binding DataContext.Data}" 
                        ChartType="Bar">
            <c1:C1FlexChart.Series>
                <c1:Series SeriesName="三月" 
                           Binding="March"/>
                <c1:Series SeriesName="四月" 
                           Binding="April"/>
                <c1:Series SeriesName="五月" 
                           Binding="May"/>
            </c1:C1FlexChart.Series>
        </c1:C1FlexChart>

    </Grid>
DataCreator.cs
コードのコピー 
class DataCreator
{
    public static List<FruitDataItem> CreateFruit()
    {
        var fruits = new string[] { "蜜柑", "林檎", "梨", "バナナ" };
        var count = fruits.Length;
        var result = new List<FruitDataItem>();
        var rnd = new Random();
        for (var i = 0; i < count; i++)
            result.Add(new FruitDataItem()
            {
                Fruit = fruits[i],
                March = rnd.Next(20),
                April = rnd.Next(20),
                May = rnd.Next(20),
            });
        return result;
    }

}
public class FruitDataItem
{
    public string Fruit { get; set; }
    public double March { get; set; }
    public double April { get; set; }
    public double May { get; set; }
}

public class DataPoint
{
    public double XVals { get; set; }
    public double YVals { get; set; }
}

MainWindow.xaml.cs
コードのコピー 
public partial class MainWindow : Window
{

    #region plotdata
    private List<FruitDataItem> _fruits;
    
    public MainWindow()
    {
        this.InitializeComponent();          
        
    }

    public List<FruitDataItem> Data
    {
        get
        {
            if (_fruits == null)
            {
                _fruits = DataCreator.CreateFruit();
            }

            return _fruits;
        }
    }

コードを実行すると、次の出力が表示されます。

 

 

Copyright © MESCIUS, Inc. All rights reserved.