SciChart® the market leader in Fast WPF Charts, WPF 3D Charts, and now iOS Charting & Android Chart Components

1
0

I am using the MVVM pattern.

I trying to manage the number of YAxes in my chart in a dynamic manner by binding the YAxes in the chart to a collection so that each time I add a new line series that line series gets its own axis.

When I do this I am getting a null reference expection.
If I hard code the YAxes or YAxis my chart loads.

Here is the xaml:

<SciChart:SciChartSurface x:Name="historicalChart" 
    RenderableSeries="{Binding HistoricalRenderableSeries, Mode=TwoWay}"
    YAxes="{Binding ChartYAxes, Mode=TwoWay}"
    SciChart:ThemeManager.Theme="ExpressionLight">
   ...
</s:SciChartSurface>

Here is the ViewModel

I tried both an ObservableCollection and a AxisCollection in my view model.

private ObservableCollection<NumericAxis> _chartYAxes = new ObservableCollection<NumericAxis>();
public ObservableCollection<NumericAxis> ChartYAxes
{
  get { return _chartYAxes; }
  set
  {
    _chartYAxes = value;
    NotifyPropertyChanged("ChartYAxes");
  }
}

private AxisCollection _chartYAxes = new AxisCollection();
public AxisCollection ChartYAxes
{
  get { return _chartYAxes; }
  set
  {
    _chartYAxes = value;
    NotifyPropertyChanged("ChartYAxes");
  }
}

Can anyone suggest a way to manage a variable number of YAxes in a chart?

  • You must to post comments
1
0

Your code looks correct, you need to bind to AxisCollection not ObservableCollection, SciChart expects this type. Of course, you’ll need to initialize the AxisCollection to an empty collection and you should then be able to add/remove axes freely.

So you need to do this

Xaml:

<SciChart:SciChartSurface x:Name="historicalChart" 
    RenderableSeries="{Binding HistoricalRenderableSeries, Mode=TwoWay}"
    YAxes="{Binding ChartYAxes, Mode=TwoWay}"
    SciChart:ThemeManager.Theme="ExpressionLight">
   ...
</s:SciChartSurface>

ViewModel

I tried both an ObservableCollection and a AxisCollection in my view model.

private AxisCollection _chartYAxes = new AxisCollection();
public AxisCollection ChartYAxes
{
  get { return _chartYAxes; }
  set
  {
    _chartYAxes = value;
    NotifyPropertyChanged("ChartYAxes");
  }
}

Then, you can add or remove Axis to the AxisCollection dynamically. Don’t forget when dynamically adding or removing Axes:

  1. To set the AxisBase.Id to a new, unique string. The first axis has by default “DefaultAxisId”. Subsequent axis need another user-provided ID.
  2. To ensure that the RenderableSeries you are using have YAxisId, XAxisId set (unless default). If not, they will not render.

Let me know if this solves the problem!

Images
  • You must to post comments
0
0

Update May 2015:

We also have a worked example over here which shows another method of dynamically adding/removing Axis in MVVM. In this method, we create an attached behaviour and bind to an ObservableCollection of AxisViewModel, therefore this is a true MVVM implementation (does not have creation of NumericAxis in the ViewModel)

See the article Template items of an AxisCollection for further information

Best regards,
Andrew

  • You must to post comments
Showing 2 results
Your Answer

Please first to submit.