【问题标题】:Binding DataSet to Chart将数据集绑定到图表
【发布时间】:2011-07-08 16:26:39
【问题描述】:

我想绑定到图表的数据表中有 2 列。 Visifire 示例显示了使用 observablecollection 的示例,但我不知道如何将数据表与 observablecollection 相关联(我认为这是我的问题)。我创建了一个示例来可视化。我正在为图表使用 visifire。

    public MainWindow()
    {
        InitializeComponent();

        dtBandwidth = dsBandwidth.Tables.Add();
        dtBandwidth.Columns.Add("ID", typeof(int));
        dtBandwidth.Columns.Add("Time", typeof(double));
        dtBandwidth.Columns.Add("Value", typeof(double));

        dataGrid1.ItemsSource = dtBandwidth.DefaultView;

        DataSeries ds = new DataSeries();
        ds.RenderAs = RenderAs.Line;
        ds.DataSource = dtBandwidth???; //i know this is wrong. what should i do?
        DataMapping dm = new DataMapping();
        dm.MemberName = "XValue";
        dm.Path = "Time";
        ds.DataMappings.Add(dm);
        dm = new DataMapping();
        dm.MemberName = "YValue";
        dm.Path = "Value";
        ds.DataMappings.Add(dm);

        chart1.Series.Add(ds);
        chart1.DataContext = dtBandwidth???; //i know this is wrong. what should i do?

    }

    private void button1_Click(object sender, RoutedEventArgs e)
    {
        dtBandwidth.Rows.Add(1, 1.0, 5.2);
        dtBandwidth.Rows.Add(2, 2.1, 5.1);
        dtBandwidth.Rows.Add(3, 3.2, 5.3);
        dtBandwidth.Rows.Add(4, 4.3, 5.4);
        dtBandwidth.Rows.Add(5, 5.4, 5.5);
    }

这里是 xaml。

<Grid>
    <DataGrid AutoGenerateColumns="True" Height="311" HorizontalAlignment="Left" Name="dataGrid1" VerticalAlignment="Top" Width="143" />
    <my:Chart HorizontalAlignment="Left" Margin="149,0,0,0" Name="chart1" VerticalAlignment="Top" Height="311" Width="354" />
    <Button Content="Button" Height="23" HorizontalAlignment="Left" Margin="186,328,0,0" Name="button1" VerticalAlignment="Top" Width="75" Click="button1_Click" />
</Grid>

我确实尝试在官方 visifire 论坛上提问,但支持人员只是懒惰(当我告诉他们我已经看过示例时,它告诉我看示例。另外,部分代码是从样本)。

这种事情让我想放弃 visifire 并寻找具有良好文档和支持的替代方案。欢迎提出任何建议。

【问题讨论】:

    标签: wpf data-binding datatable observablecollection visifire


    【解决方案1】:

    http://www.visifire.com/silverlight_examples_details.php?id=10

    如果您查看上面的示例,您可以看到 DataSeries 的 DataSource 属性设置为 Grid 的 ItemsSource,它只是一个集合(Value 类的 ObservableCollection)。

    DataSource="{Binding ItemsSource, ElementName=MyGrid}"

    因此您需要将 DataSeries 的 DataSource 属性设置为行的集合(除了表之外什么都没有。

    ds.DataSource = dtBandwidth.Tables[0].DefaultView;

    查看下面的示例代码。

    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
    
            DataSet dtBandwidth = new DataSet();
            dtBandwidth.Tables.Add("BandWidth");
            dtBandwidth.Tables[0].Columns.Add("ID", typeof(int));
            dtBandwidth.Tables[0].Columns.Add("Time", typeof(double));
            dtBandwidth.Tables[0].Columns.Add("Value", typeof(double));
    
            dtBandwidth.Tables[0].Rows.Add(new object[] { 2, 1, 5 });
            dtBandwidth.Tables[0].Rows.Add(new object[] { 2, 2, 25 });
    
            DataSeries ds = new DataSeries();
            ds.RenderAs = RenderAs.Line;
    
            ds.DataSource = dtBandwidth.Tables[0].DefaultView;
    
            DataMapping dm = new DataMapping();
            dm.MemberName = "XValue";
            dm.Path = "Time";
            ds.DataMappings.Add(dm);
            dm = new DataMapping();
            dm.MemberName = "YValue";
            dm.Path = "Value";
            ds.DataMappings.Add(dm);
    
            chart1.Series.Add(ds);
    
        }
    }
    

    XAML:

    <Window x:Class="WpfApplication3.MainWindow"
            xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
            Title="MainWindow" Height="350" Width="525"
            xmlns:vc="clr-namespace:Visifire.Charts;assembly=WPFVisifire.Charts">
        <Grid>
            <vc:Chart Name="chart1" Width="500" Height="300" Padding="10,10" Margin="10,0" AnimatedUpdate="True">
        </vc:Chart>
    </Grid>
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2015-02-28
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多