Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Binding to DevExpress StockSeries2D Chart

I am trying to bind an ObservableCollection of data from my ViewModel to the Devexpress 2D Stock Chart in the View. I know that the VM is bound do the View's DataContext because I have the window's Title bound to a property in the VM and it is correct when I run the program. The collection is instantiated correctly, I can see that all the objects are created, have values, and are added to the collection.

The chart information just isn't displaying. The chart shows up just not the information that is supposed to be bound to it. I'm guessing it has to do with a line in my XAML but I just don't know what it is.

Here is the Error from the Output:

System.Windows.Data Error: 40 : BindingExpression path error: 'Snapshots' property not found on 'object' ''ChartElementPanel' (Name='')'. BindingExpression:Path=DataContext.Snapshots; DataItem='ChartElementPanel' (Name=''); target element is 'StockSeries2D' (HashCode=24500892); target property is 'DataSource' (type 'Object')

The DevExpress version is 10.1.9

EDIT: I think I know where the problem is coming in at. The StockSeries2D DataContext = DevExpress.Xpf.Charts.ChartElementPanel So when I use

DataSource="{Binding Path=DataContext.Snapshots}"

It really points to the DevExpress.Xpf.Charts.ChartElementPanel and since it doesn't contain a Snapshots property the error is thrown.

XAML:

    <Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="200" />
        <RowDefinition Height="50" />
    </Grid.RowDefinitions>
    <dxc:ChartControl Name="chartControl1">
        <dxc:ChartControl.Diagram>
            <dxc:XYDiagram2D>
                <dxc:XYDiagram2D.Series>
                    <dxc:StockSeries2D DataSource="{Binding DataContext.Snapshots}" HighValueDataMember="High" LowValueDataMember="Low" CloseValueDataMember="Last" ArgumentScaleType="DateTime" ArgumentDataMember="TimeStamp">

                        <dxc:StockSeries2D.PointOptions>
                            <dxc:PointOptions dxc:FinancialSeries2D.ValueToDisplay="HighValue" />
                        </dxc:StockSeries2D.PointOptions>

                        <dxc:StockSeries2D.Model>
                            <dxc:ArrowsStock2DModel />
                        </dxc:StockSeries2D.Model>
                    </dxc:StockSeries2D>
                </dxc:XYDiagram2D.Series>

                <!--Region #Axis X-->
                <dxc:XYDiagram2D.AxisX>
                    <dxc:AxisX2D>
                        <dxc:AxisX2D.DateTimeOptions>
                            <dxc:DateTimeOptions Format="ShortTime" />
                        </dxc:AxisX2D.DateTimeOptions>
                    </dxc:AxisX2D>
                </dxc:XYDiagram2D.AxisX>
                <!-- End Rgion -->

                <!-- region #AxisY -->
                <dxc:XYDiagram2D.AxisY>
                    <dxc:AxisY2D>
                        <dxc:AxisY2D.Range>
                            <dxc:AxisRange dxc:AxisY2D.AlwaysShowZeroLevel="False" />
                        </dxc:AxisY2D.Range>
                    </dxc:AxisY2D>
                </dxc:XYDiagram2D.AxisY>

                <!--End Rgion-->
            </dxc:XYDiagram2D>
        </dxc:ChartControl.Diagram>
    </dxc:ChartControl>
</Grid>

ViewModel:

    public class MainWindowViewModel : INotifyPropertyChanged
{
    ObservableCollection<ISnapShot> _snapShots;
    string _windowTitle;

    public MainWindowViewModel()
    {
        _snapShots = new ObservableCollection<ISnapShot>();
        LoadSnapshots();
        WindowTitle = Snapshots.First().Symbol;
    }

    public ObservableCollection<ISnapShot> Snapshots
    {
        get { return _snapShots; }
    }

    public String WindowTitle
    {
        get { return _windowTitle; }
        set { _windowTitle = value; OnPropertyChanged("WindowTitle"); }
    }

    private void AddSnapshot(ISnapShot snapshot)
    {
        _snapShots.Add(snapshot);
    }

    private void LoadSnapshots()
    {
        int counter = 0;

        while (counter < 5)
        {
            ISnapShot s = new Snapshot()
            {
                TimeStamp = DateTime.Now,
                Symbol = "XYZ",
                High = (counter + 1) * 5,
                Low = (counter + 1) * 2,
                Last = (counter + 1) * 3
            };

            _snapShots.Add(s);
            counter++;
            Thread.Sleep(1000);
        }

    }

    public event PropertyChangedEventHandler PropertyChanged;
    void OnPropertyChanged(string prop)
    {
        if (PropertyChanged != null)
            PropertyChanged(this, new PropertyChangedEventArgs(prop));
    }
}

View:

    public partial class MainWindow : Window
{
    private MainWindowViewModel _vm;


    public MainWindow(MainWindowViewModel vm)
    {
        InitializeComponent();
        _vm = vm;
        this.DataContext = _vm;
    }
}

App:

public partial class App : Application
{
    private void OnStartup(object sender, StartupEventArgs e)
    {
        MainWindowViewModel vm = new MainWindowViewModel();
        Views.MainWindow view = new Views.MainWindow(vm); 
        view.Show();
    }
}
like image 892
Stephen Gilboy Avatar asked Jan 27 '12 20:01

Stephen Gilboy


1 Answers

I figured it out. Since the DataContext of StockSeries2D does not point to the DataContext of the Window

<dxc:StockSeries2D DataContext="DevExpress.Xpf.Charts.ChartElementPanel"

I needed to set the DataSource to use the Window's DataContext

<dxc:StockSeries2D DataSource="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type Window}}, Path=DataContext.Snapshots}"

like image 96
Stephen Gilboy Avatar answered Oct 20 '22 18:10

Stephen Gilboy