Search code examples
chartslineseries

WPF Toolkit - Binding LineSeries in code behind


I've spent a few days trying to bind my data model to a lineseries. I works fine; however, I want to change the line color. I knew where to change the color, yet the chart and series would ignore my binding (was a SolidColorBrush). If I hard-coded the color in XAML it would work; however, if I tried to bind the same property to the color property in my view model it would not work. After too much time was spent I gave up for 2 reasons.

  1. It just wouldn't work
  2. I realized I was going to need to bind 'x' number of view models to the chart to show more than one line series at a time.

I eventually just defined my line series in the code behind like so...

LineSeries BuildLine(DosePointsViewModel model)
    {
        LineSeries series = new LineSeries();

        // styles
        Style poly = new Style(typeof(Polyline));
        poly.Setters.Add(new Setter(Polyline.StrokeProperty, model.LineColor));
        poly.Setters.Add(new Setter(Polyline.StrokeThicknessProperty, 3d));
        series.PolylineStyle = poly;

        Style pointStyle = new Style(typeof(LineDataPoint));
        pointStyle.Setters.Add(new Setter(LineDataPoint.BackgroundProperty, model.LineColor));
        series.DataPointStyle = pointStyle;

        // binding
        series.IsSelectionEnabled = false;
        series.IndependentValueBinding = new System.Windows.Data.Binding("Distance");
        series.DependentValueBinding = new System.Windows.Data.Binding("Dose");

        // X axis
        LinearAxis xAxis = new LinearAxis();
        xAxis.Title = "Distance";
        xAxis.ShowGridLines = false;
        xAxis.Interval = 1;
        xAxis.Orientation = AxisOrientation.X;
        series.IndependentAxis = xAxis;

        // Y axis
        LinearAxis yAxis = new LinearAxis(); //series.DependentRangeAxis as LinearAxis;
        yAxis.Maximum = 5000d;
        yAxis.Minimum = -100d;
        yAxis.Minimum = model.Points.Min(d => d.Dose) - model.Points.Min(d => d.Dose) * 0.50;
        yAxis.Maximum = model.Points.Max(d => d.Dose) + model.Points.Max(d => d.Dose) * 0.05;
        yAxis.ShowGridLines = true;
        yAxis.Orientation = AxisOrientation.Y;
        yAxis.Title = "Dose";

        Style s = new Style(typeof(Line));
        s.Setters.Add(new Setter(Line.StrokeProperty, new SolidColorBrush(Colors.LightBlue)));
        s.Setters.Add(new Setter(Line.StrokeThicknessProperty, 1d));
        yAxis.GridLineStyle = s;
        series.DependentRangeAxis = yAxis;

        return series;
    }

Now, the color for my line series works. Of course, the primary reason for this is that I'm directly setting the color via ...

poly.Setters.Add(new Setter(Polyline.StrokeProperty, model.LineColor));
pointStyle.Setters.Add(new Setter(LineDataPoint.BackgroundProperty, model.LineColor));

So, my question is this. I want to be able to add multiple line series to the chart; however, when I try to do this, only the last item is being bound. Inside the code, this is done for each line series being created. Only the last line series is added to the chart.

DosePointsViewModel model = new DosePointsViewModel(_snc, m.Id);
            LineSeries series = BuildLine(model);
            DoseChart.Series.Clear();
            DoseChart.Series.Add(series);

Solution

  • Wow, as I'm reading my question I realize that I am calling

    DoseChart.Series.Clear();
    

    Well that was an interesting find.