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

Question

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

原始问题:我正在尝试使用动态数据显示LineGraph，但在更新时遇到了问题(D3链接：http://dynamicdatadisplay.codeplex.com/)

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

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

据我所知，最好的方法是在代码中设置一个表示DataSource的属性，并将图表的DataSource绑定到该属性。让您的代码在每次更新或重新分配数据源时实现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));
}