使用绑定时动态数据显示线图未正确更新

Question

此问题已解决。我在下面的代码中添加了修复，注释掉的部分来自旧代码。

原问题： 我正在尝试使用动态数据显示线图，但无法更新（D3 链接：http://dynamicdatadisplay.codeplex.com/）

代码编译并运行，并将在构造函数中显示 Line，但是当我启动其中一条显示消息时，图表不会更新。我已验证显示消息已到达那里并且值列表已更新，如果单击图表或使用缩放功能，则数据将在屏幕上更新。

XXX_Display1_VM.cs：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Collections.ObjectModel;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using XXX.BaseTypes;
using XXX.BaseClasses.BaseViewModels;
using XXX.InterfaceLibrary.Interfaces.Mediator;
using XXX.InterfaceLibrary.Interfaces.SystemController;
using System.Web;
using System.ComponentModel;
using Microsoft.Research.DynamicDataDisplay.DataSources;

namespace SystemController
{

    public class ModelData
    {
        public double XValue { get; set; }
        public double YValue { get; set; }
        public ModelData(double x, double y)
        {
            XValue = x;
            YValue = y;
        }
    }

    class XXX_Display1_VM : ViewModelBase, INotifyPropertyChanged, IXXX_Display1_VM
    {
        IXXX_Driver _Driver;
        IMediator _Messenger;


        public ObservableCollection<ModelData> Values { get; private set; }


        CompositeDataSource _Display1;
        public CompositeDataSource Display1
        {
            get
            {
                //Removed this and moved it to the areas where the values are being set
                //if (_Display1 == null)
                //{
                    //var xData = new EnumerableDataSource<double>(Values.Select(v => v.YValue));
                    //xData.SetXMapping(x => x);
                    //var yData = new EnumerableDataSource<double>(Values.Select(v => v.XValue));

                    //yData.SetYMapping(y => y);
                    //_Display1 = xData.Join(yData);              

                //}

                return _Display1;
            }
        }

        public event PropertyChangedEventHandler PropertyChanged;

        //protected void RaisePropertyChanged(string propertyName)
        //{
        //    if (PropertyChanged != null)
        //    {
        //        PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        //    }
        //}

        protected void OnPropertyChanged(PropertyChangedEventArgs e)
        {
            PropertyChangedEventHandler handler = PropertyChanged;
            if (handler != null)
            {
               handler(this, e);
            }
        }

        protected void OnPropertyChanged(string propertyName)
        {
            OnPropertyChanged(new PropertyChangedEventArgs(propertyName));
        }



        public XXX_Display1_VM(IXXX_Driver InDriver, IMediator InMessenger)
        {
            _Driver = InDriver;
            _Messenger = InMessenger;

            _Messenger.Register<DisplayMsgData>(ShellMessage.DISPLAY_MESSAGE_EVENT, OnReceiveDisplayMessage);


            Values = new ObservableCollection<ModelData>();
            _Display1 = new CompositeDataSource();

            Values.Add(new ModelData(1.0,1.0));
            Values.Add(new ModelData(1.5, 2.0));
            Values.Add(new ModelData(2.0, 2.5));

            var xData = new EnumerableDataSource<double>(Values.Select(v => v.YValue));
            xData.SetXMapping(x => x);
            var yData = new EnumerableDataSource<double>(Values.Select(v => v.XValue));
            yData.SetYMapping(y => y);

            _Display1 = xData.Join(yData);


        }

        private void OnReceiveDisplayMessage(DisplayMsgData Data)
        {
            if (Data.MsgType == "SetMode1")
            {
                Values.Clear();
                Values.Add(new ModelData(2.0, 1.0));
                Values.Add(new ModelData(1.5, 2.0));
                Values.Add(new ModelData(2.0, 2.5));

                var xData = new EnumerableDataSource<double>(Values.Select(v => v.YValue));
                xData.SetXMapping(x => x);
                var yData = new EnumerableDataSource<double>(Values.Select(v => v.XValue));

                yData.SetYMapping(y => y);
                _Display1 = xData.Join(yData);

                OnPropertyChanged("Display1");                    
            }
            else if (Data.MsgType == "SetMode2")
            {
                Values.Clear();
                Values.Add(new ModelData(3.0, 1.0));
                Values.Add(new ModelData(2.5, 2.0));
                Values.Add(new ModelData(5.0, 2.5));

                var xData = new EnumerableDataSource<double>(Values.Select(v => v.YValue));
                xData.SetXMapping(x => x);
                var yData = new EnumerableDataSource<double>(Values.Select(v => v.XValue));

                yData.SetYMapping(y => y);
                _Display1 = xData.Join(yData);

                OnPropertyChanged("Display1");
            }
            else if (Data.MsgType == "SetMode3")
            {
                Values.Clear();
                Values.Add(new ModelData(1.0, 3.0));
                Values.Add(new ModelData(2.5, 2.0));
                Values.Add(new ModelData(3.0, 1.5));

                var xData = new EnumerableDataSource<double>(Values.Select(v => v.YValue));
                xData.SetXMapping(x => x);
                var yData = new EnumerableDataSource<double>(Values.Select(v => v.XValue));

                yData.SetYMapping(y => y);
                _Display1 = xData.Join(yData);

                OnPropertyChanged("Display1");
            }
        }

        public string GetClassName()
        {
            return "XXX_DisplayController_VM";
        }


    }
}

XXX_Display1.xaml.cs：

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using XXX.InterfaceLibrary.Interfaces.SystemController;

namespace SystemController
{
    /// <summary>
    /// Interaction logic for XXX_Display1.xaml
    /// </summary>
    public partial class XXX_Display1 : UserControl, IXXX_Display1
    {        
        IXXX_Display1_VM _VM;
        IXXX_Driver _Driver;


        public XXX_Display1(IXXX_Driver InDriver, IXXX_Display1_VM InVM)
        {
            _VM = InVM;
            _Driver = InDriver;
            DataContext = InVM; //new XXX_Display1_VM(_Driver);
            InitializeComponent();


        }

        public string GetClassName()
        {
            return "XXX_Display1";
        }  
    }
}

XXX_Display1.xaml：

<UserControl x:Class="SystemController.XXX_Display1"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:d3="http://research.microsoft.com/DynamicDataDisplay/1.0" 
             mc:Ignorable="d" 
             d:DesignHeight="550" d:DesignWidth="550">
    <Grid>
        <d3:ChartPlotter Name="Display1" Height="400" Width="400">
            <d3:Header>
                <TextBlock HorizontalAlignment="Center" FontSize="20">Very simple line plot</TextBlock>
            </d3:Header>
            <d3:VerticalAxisTitle>This is vertical axis</d3:VerticalAxisTitle>
            <d3:HorizontalAxisTitle>This is horizontal axis</d3:HorizontalAxisTitle>
            <d3:LineGraph DataSource="{Binding Path=Display1}" Stroke="Black"/>

        </d3:ChartPlotter>
    </Grid>
</UserControl>

谢谢。

Answer 1

我发现做到这一点的最佳方法是在您的代码中使用一个属性来表示数据源并将图表的数据源绑定到该属性。每次更新或重新分配数据源时，让您的代码实现 INotifyPropertyChanged 并调用 OnPropertyChanged。这将强制绘图仪观察绑定并重新绘制图表。

例子：

EnumerableDataSource<Point> m_d3DataSource;
public EnumerableDataSource<Point> D3DataSource {
    get {
        return m_d3DataSource;
    }
    set {                
        //you can set your mapping inside the set block as well             
        m_d3DataSource = value;
        OnPropertyChanged("D3DataSource");
    }
}     

protected void OnPropertyChanged(PropertyChangedEventArgs e) {
    PropertyChangedEventHandler handler = PropertyChanged;
    if (handler != null) {
        handler(this, e);
    }
} 

protected void OnPropertyChanged(string propertyName) {
    OnPropertyChanged(new PropertyChangedEventArgs(propertyName));
}