如何将WPF Toolkit图表的数据源动态数据绑定到公共属性?

时间:2012-05-04 12:57:00

标签: .net wpf charts

如何动态更新WPF ToolKit图表控件的数据源?在下面的示例中,我使用{Binding SomeText}成功更新TextBlock.Text属性,并将MainWindow的DataContext设置为属性Input。 (请参阅下面的代码)

将TextBlock.Text绑定到Input.SomeText,并假设Chart使用Input.ValueList作为数据源。

该图表仍为空。我可以通过放置

填写一次
lineChart.DataContext = Input.ValueList;
在主窗口构造函数中

并将XAML中的绑定设置为ItemsSource =“{Binding}”。但这仅适用于启动时,例如单击按钮时不会更新。我想在应用程序运行时使用新的传入数据更新图表。

我有以下XAML:

<chartingToolkit:Chart  Name="lineChart">

                <chartingToolkit:LineSeries DependentValuePath="Value" IndependentValuePath="Key" ItemsSource="{Binding ValueList}">
                </chartingToolkit:LineSeries>

</chartingToolkit:Chart>
<Button Width="100" Height="24" Content="More" Name="Button1" />
<TextBlock Name="TextBlock1" Text="{Binding SomeText}" />

使用代码:

class MainWindow
{

    public DeviceInput Input;

    public MainWindow()
    {
        InitializeComponent();

        Input = new DeviceInput();
        DataContext = Input;
            lineChart.DataContext = Input;
        Input.SomeText = "Lorem ipsum.";

    }

    private void Button1_Click(System.Object sender, System.Windows.RoutedEventArgs e)
    {
        Input.AddValues();
    }
}

public class DeviceInput : INotifyPropertyChanged
{

    private string _SomeText;
    public string SomeText {
        get { return _SomeText; }

        set {
            _SomeText = value;
            OnPropertyChanged("SomeText");
        }
    }


    public List<KeyValuePair<string, int>> ValueList {get; private set;}

    public DeviceInput()
    {
        ValueList = (new List<KeyValuePair<string, int>>());
        AddValues();
    }

    public void AddValues()
    {
            //add values (code removed for readability)
        SomeText = "Items: " + ValueList.Count.ToString();
        OnPropertyChanged("ValueList");
    }

    public event PropertyChangedEventHandler INotifyPropertyChanged.PropertyChanged;

    private void OnPropertyChanged(String info)
    {
        if (PropertyChanged != null) {
            PropertyChanged(this, new PropertyChangedEventArgs(info));
        }
    }

}

SomeText会更新并确保ValueList更改我将ValueList.Count置于文本块中,您可以看到计数上升,但图表保持不变。

因此,这会导致1次成功绑定(但不会更新):

lineChart.DataContext = Input.ValueList;

ItemsSource="{Binding}"

这完全没有约束力:

ItemsSource="{Binding ValueList}"

1 个答案:

答案 0 :(得分:6)

wpf绑定到公共属性,因此您需要

 public List<KeyValuePair<string, int>> ValueList {get; private set;}

编辑:here有关使用图表控件的更多信息。

EDIT2:

ItemsSource="{Binding ValueList}"

这不起作用,因为你必须首先创建ValueList作为属性,然后你需要将datacontext设置为DeviceInput的实例(就像你在mainwindow.cs中所做的那样)。

EDIT3:快速而肮脏的例子,只需复制和粘贴,如果按下按钮数据将被添加

视图模型

public class Input
{
    public ObservableCollection<KeyValuePair<string, int>> ValueList { get; private set; }

    public Input()
    {
        this.ValueList = new ObservableCollection<KeyValuePair<string, int>>();
        ValueList.Add(new KeyValuePair<string, int>("Developer", 60));
        ValueList.Add(new KeyValuePair<string, int>("Misc", 20));
        ValueList.Add(new KeyValuePair<string, int>("Tester", 50));
        ValueList.Add(new KeyValuePair<string, int>("QA", 30));
        ValueList.Add(new KeyValuePair<string, int>("Project Manager", 40));
    }

    public void Add(KeyValuePair<string, int> data)
    {
        ValueList.Add(data);
    }
}

window.cs

public partial class MainWindow : Window
{
  private Input data;
  public MainWindow()
  {
    data= new Input();
    InitializeComponent();
    this.DataContext = data;
  }

  private void button1_Click(object sender, RoutedEventArgs e)
  {
    this.data.Add(new KeyValuePair<string, int>("XXX", 27));
  }

}

XAML

<ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" Margin="0,-28,0,28">
    <Grid Height="921">
        <chartingToolkit:Chart Height="262" HorizontalAlignment="Left" Margin="33,0,0,620" Name="columnChart" Title="Column Series Demo" VerticalAlignment="Bottom" Width="360">
            <chartingToolkit:ColumnSeries DependentValuePath="Value" IndependentValuePath="Key" ItemsSource="{Binding ValueList }" />              
        </chartingToolkit:Chart>
        <chartingToolkit:Chart  Name="pieChart" Title="Pie Series Demo" VerticalAlignment="Top" Margin="449,39,43,0" Height="262">
            <chartingToolkit:PieSeries DependentValuePath="Value" IndependentValuePath="Key" ItemsSource="{Binding ValueList }" IsSelectionEnabled="True" />
        </chartingToolkit:Chart>
        <chartingToolkit:Chart  Name="areaChart" Title="Area Series Demo" VerticalAlignment="Top" Margin="33,330,440,0" Height="262">
            <chartingToolkit:AreaSeries DependentValuePath="Value" IndependentValuePath="Key" ItemsSource="{Binding ValueList }" IsSelectionEnabled="True"/>
        </chartingToolkit:Chart>
        <chartingToolkit:Chart  Name="barChart" Title="Bar Series Demo" VerticalAlignment="Top" Margin="449,330,43,0" Height="262">
            <chartingToolkit:BarSeries  DependentValuePath="Value" IndependentValuePath="Key" ItemsSource="{Binding ValueList }" IsSelectionEnabled="True"/>
        </chartingToolkit:Chart>
        <chartingToolkit:Chart  Name="lineChart" Title="Line Series Demo" VerticalAlignment="Top" Margin="33,611,440,0" Height="254">
            <chartingToolkit:LineSeries  DependentValuePath="Value" IndependentValuePath="Key" ItemsSource="{Binding ValueList }" IsSelectionEnabled="True"/>
        </chartingToolkit:Chart>
        <Button Content="Button" Height="23" HorizontalAlignment="Left" Margin="342,10,0,0" Name="button1" VerticalAlignment="Top" Width="75" Click="button1_Click" />
    </Grid>
</ScrollViewer>