WPF图表工具包 - 多个Scatter系列 - 数据绑定

时间:2015-09-29 18:10:44

标签: c# wpf xaml charts scatter-plot

我可以通过WPF图表工具包显示一个名为FinalResult的散点图系列。

 public List<KeyValuePair<double,double>> FinalResult
    {
        get
        {
            return _finalResult;
        }
        set
        {
            if (_finalResult == value) return;
            _finalResult = value;
            OnPropertyChanged("FinalResult");
        }
    }
    public List<KeyValuePair<double, double>> _finalResult;

在Xaml中,我只是将此属性称为:

<chartingToolkit:Chart Name="lineChart" Background = "White" Title="CDF - Charting Kit">
            <chartingToolkit:ScatterSeries DependentValuePath="Value" IndependentValuePath="Key"  IsSelectionEnabled="True" 
                                               ItemsSource="{Binding FinalResult}" />

            <chartingToolkit:Chart.Axes>
                <chartingToolkit:LinearAxis Orientation="Y" ShowGridLines="True" />

                <chartingToolkit:LinearAxis Orientation="X" ShowGridLines="True" />

            </chartingToolkit:Chart.Axes>
        </chartingToolkit:Chart>

现在,下一步是显示多个分散系列。我以为我可以像这样使用观察集合并在XAML中使用该属性,但现在我没有看到任何图表。这是代码:

public class CDFPlot
    {
       public List<KeyValuePair<double, double>> FinalResult1 { get; set; }
    }
    ObservableCollection<CDFPlot> CDFresults = new ObservableCollection<CDFPlot>();
    public ObservableCollection<CDFPlot> CDFResults
    {
        get { return CDFresults; }
        set
        {
            CDFresults = value;
            base.OnPropertyChanged("StringList");
        }
    }

然后在xaml方面,我确实绑定到“FinalResult1”。

 <chartingToolkit:Chart Name="lineChart" Background = "White" Title="CDF - Charting Kit">
            <chartingToolkit:ScatterSeries DependentValuePath="Value" IndependentValuePath="Key"  IsSelectionEnabled="True" 
                                               ItemsSource="{Binding FinalResult1}" />

            <chartingToolkit:Chart.Axes>
                <chartingToolkit:LinearAxis Orientation="Y" ShowGridLines="True" />

                <chartingToolkit:LinearAxis Orientation="X" ShowGridLines="True" />

            </chartingToolkit:Chart.Axes>
        </chartingToolkit:Chart>

当我运行调试时,我可以看到填充了CDFPLOT.FinalResult1。 我正确绑定了吗?请告知我该如何解决?

到目前为止,我尝试过的另一种解决方法是在代码中构建图表,而不是通过xaml ..

 private void showChart()
    {
        CDF_PAnalysisPluginModel model = DataContext as CDF_PAnalysisPluginModel;

        LineSeries lineSeries1 = new LineSeries();

        lineSeries1.Title = "Title";
        lineSeries1.DependentValuePath = "Value";
        lineSeries1.IndependentValuePath = "Key";

            foreach (var x in model.CDFResults)
            {

                lineSeries1.ItemsSource = x.FinalResult1;

             lineChart.Series.Add(lineSeries1);  // error on this line

            }

    } 

和xaml是:

<chartingToolkit:Chart Name="lineChart" Background = "White" Title="CDF - Charting Kit">
</chartingToolkit:Chart>

但是如上所述我在线上得到错误。

1 个答案:

答案 0 :(得分:2)

如果DataContext已正确分配,则可行,如下所示:

<Window.DataContext>
    <local:CDFPlot/>
</Window.DataContext>
<Grid>
    <chartingToolkit:Chart Name="lineChart" Background = "White" Title="CDF - Charting Kit">
        <chartingToolkit:ScatterSeries DependentValuePath="Value" IndependentValuePath="Key"  IsSelectionEnabled="True" 
                                           ItemsSource="{Binding FinalResult1}" />

        <chartingToolkit:Chart.Axes>
            <chartingToolkit:LinearAxis Orientation="Y" ShowGridLines="True" />

            <chartingToolkit:LinearAxis Orientation="X" ShowGridLines="True" />

        </chartingToolkit:Chart.Axes>
    </chartingToolkit:Chart>
</Grid>

enter image description here

现在,请注意FinalResult1只能保存一个ScatterSeries的数据,而不是您想要的多个数据。

编辑:这是我使用您的初始代码添加多个系列的方式:

XAML:

<Grid>
    <Grid.DataContext>
        <local:CDFViewModel/>
    </Grid.DataContext>
    <chartingToolkit:Chart x:Name="chart1" Margin="0" Title="Chart Title">
        <chartingToolkit:ScatterSeries DependentValuePath="Y" IndependentValuePath="X" ItemsSource="{Binding CDFPlotCollection[0]}">
        </chartingToolkit:ScatterSeries>
        <chartingToolkit:ScatterSeries DependentValuePath="Y" IndependentValuePath="X" ItemsSource="{Binding CDFPlotCollection[1]}">
        </chartingToolkit:ScatterSeries>
    </chartingToolkit:Chart>
</Grid>

视图模型:

public class CDFViewModel
{
    public ObservableCollection<CDFPlot> CDFPlotCollection { get; set; }

    public CDFViewModel()
    {
        Random r = new Random();
        CDFPlotCollection = new ObservableCollection<CDFPlot>();

        CDFPlotCollection.Add(new CDFPlot(r, 0));
        CDFPlotCollection.Add(new CDFPlot(r, 2));
    }
}

型号:

public class CDFPlot : ObservableCollection<Point>
{
    public CDFPlot(Random r, double delta)
    {
        for (int i = 0; i < 50; i++)
            Add(new Point { X = i, Y = delta+r.NextDouble() });
    }
}

enter image description here

编辑2 :或者您可以使用后面的代码获得相同的结果:

XAML:

<chartingToolkit:Chart x:Name="chart1" Margin="0" Title="Chart Title">
    </chartingToolkit:Chart>

Window.cs:

     private void Window_Loaded(object sender, RoutedEventArgs e)
    {
        CDFViewModel model = new CDFViewModel();
        ScatterSeries series;

        for (int i = 0; i < model.CDFPlotCollection.Count; i++)
        {
            series = new ScatterSeries();
            series.DependentValuePath = "Y";
            series.IndependentValuePath = "X";
            series.ItemsSource = model.CDFPlotCollection[i];
            chart1.Series.Add(series);
        }
    }