1. Home
  2. Forum
  3. WPF
  4. Binding dynamic number of Series on diffrent YAxis

Binding dynamic number of Series on diffrent YAxis

Hi,

I have a dynamic amount of Series (basically this: Thread) and need to bind them individually on 4 different Yaxis. 
My attempt is, to generate 4 empty Series in the SfChart with each one Y-Axis and bind the dynamic Series on the correct one (with a Datatrigger in the Template)

Currently it looks like this:
Empty series with the y-axis (First try with two instead of four Axes):

            <syncfusion:FastLineBitmapSeries Name="TemperatureAxis">
                <syncfusion:FastLineBitmapSeries.YAxis>
                    <syncfusion:NumericalAxis Background="Red"/>
                </syncfusion:FastLineBitmapSeries.YAxis>
            </syncfusion:FastLineBitmapSeries>
            <syncfusion:FastLineBitmapSeries x:Name="PressureAxis">
                <syncfusion:FastLineBitmapSeries.YAxis>
                    <syncfusion:NumericalAxis Background="Blue"/>
                </syncfusion:FastLineBitmapSeries.YAxis>
            </syncfusion:FastLineBitmapSeries>

Serie DataTemplate:

            <DataTemplate x:Key="LineSeriesTemplate" DataType="{x:Type visualize:DataSerie}">
                <syncfusion:FastLineBitmapSeries XBindingPath="Date" YBindingPath="Value" ItemsSource="{Binding SerieCollection}">
                    <syncfusion:FastLineBitmapSeries.Style>
                        <Style TargetType="{x:Type syncfusion:FastLineBitmapSeries}">
                            <Setter Property="YAxis" Value="{Binding YAxis, ElementName=PressureAxis}"/>
                            <Style.Triggers>
                                <DataTrigger Binding="{Binding ChannelType}" Value="{x:Static entities:UnitType.Temperature}">
                                    <Setter Property="YAxis" Value="{Binding YAxis, ElementName=TemperatureAxis}"/>
                                </DataTrigger>
                                <DataTrigger Binding="{Binding ChannelType}" Value="{x:Static entities:UnitType.Pressure}">
                                    <Setter Property="YAxis" Value="{Binding YAxis, ElementName=PressureAxis}"/>
                                </DataTrigger>
                            </Style.Triggers>
                        </Style>
                    </syncfusion:FastLineBitmapSeries.Style>
                </syncfusion:FastLineBitmapSeries>
            </DataTemplate>

This does not work, so i tried to just bind the Template on one Y-Axis to check if this works:

<DataTemplate x:Key="LineSeriesTemplate" DataType="{x:Type visualize:DataSerie}">
                <syncfusion:FastLineBitmapSeries XBindingPath="Date" YBindingPath="Value" ItemsSource="{Binding SerieCollection}" YAxis="{Binding YAxis ,ElementName=PressureAxis}" />                
            </DataTemplate>

And the result is still not what i expected (it's not bound to the blue pressure Axis, but on a new yAxis):


So why does this binding not work, and how is it possible to reach my goal?

Regards, Lukas R.

5 Replies
MK Muneesh Kumar G Syncfusion Team March 5, 2018 12:25 PM UTC

Hi Lukas Raschle, 
 
Thanks for using Syncfusion products.  
 
We have analyzed your query. We suspect that your requirement is related to set individual axis for series, we can achieve your requirement by setting YAxis for series and removing empty SecondaryAxis in chart as follows.  
 
Code snippet [XAML]: 
 
 
<local:SfChartExt.SeriesTemplate> 
  <DataTemplate> 
    <chart:ColumnSeries XBindingPath="Component" YBindingPath="Price"        ItemsSource="{Binding PriceCollection}" 
  Label="{Binding Year}"> 
    <chart:ColumnSeries.YAxis> 
    <chart:NumericalAxis Background="Blue"/> 
    </chart:ColumnSeries.YAxis> 
    </chart:ColumnSeries> 
  </DataTemplate> 
</local:SfChartExt.SeriesTemplate> 
 
 
We have modified our dynamic series sample based on your requirement. Please find the sample from the following location.  
 
 
If this is not your requirement means please give more information about your requirement that would be helpful for us to provide better solution.  
 
Regards, 
Muneesh Kumar G. 



LR Lukas R March 7, 2018 12:17 PM UTC

Hi,

I've tried it this way too, but it's not exactly what i need. 
When the y-axis is defined in the template every series has its own axis, but some of my series should share the same axis.

For example:
I have 5 Series and need to bind them on three diffrent y-axis

The amount of the series is dynamic and can change at at every point.
The Axis are always the same four (one axis for each: Pressure, Temperature, Length and conductivity)
On which axis a series should bind is determined by an enum (ChannelType.Pressure...) .

MK Muneesh Kumar G Syncfusion Team March 8, 2018 08:37 AM UTC

Hi Lukas Raschle,  
 
We have analyzed your query, we can share the same y axis with different series using converter for YAxis property as follows.  
 
Code snippet [CommonChartView.Xaml]: 
 
<Grid.Resources> 
  <local:YAxisConverter x:Key="axisConverter"/> 
</Grid.Resources> 
 
<chart:ColumnSeries XBindingPath="Component" YBindingPath="Price" 
ItemsSource="{Binding PriceCollection}" Label="{Binding Year}" 
YAxis="{Binding ChannelType,Converter={StaticResource axisConverter}}"> 
</chart:ColumnSeries> 
 
 
Code snippet [App.Xaml] 
 
 
<Application.Resources> 
        <chart:NumericalAxis Background="Blue" x:Key="axis1"/> 
 
        <chart:NumericalAxis Background="Red" x:Key="axis2"/> 
 
        <chart:NumericalAxis Background="Yellow" x:Key="axis3"/> 
 
        <chart:NumericalAxis Background="Green" x:Key="axis4"/> 
</Application.Resources> 
 
  
 
To achieve this requirement, you need to set the ChannelType for each series as follows.  
 
Code snippet [C#]: 
 
 
public ViewModel() 
{ 
            AnnualPriceCollection = new ObservableCollection<AnnualPriceData>(); 
 
            AnnualPriceCollection.Add(new AnnualPriceData() 
            { 
                Year = "2012", 
                ChannelType=ChannelType.Conductivity, 
                PriceCollection = new ObservableCollection<PriceData>() 
                { 
                    new PriceData() {Component = "Hard Disk", Price = 80 }, 
                    new PriceData() {Component = "Scanner", Price = 140  }, 
                    new PriceData() {Component = "Monitor", Price = 150  }, 
                    new PriceData() {Component = "Printer", Price = 180  }, 
                } 
            }); 
             
            AnnualPriceCollection.Add(new AnnualPriceData() 
            { 
                Year = "2013", 
                ChannelType = ChannelType.Length, 
                PriceCollection = new ObservableCollection<PriceData>() 
                { 
                    new PriceData() {Component = "Hard Disk", Price = 87 }, 
                    new PriceData() {Component = "Scanner", Price = 157  }, 
                    new PriceData() {Component = "Monitor", Price = 155  }, 
                    new PriceData() {Component = "Printer", Price = 192  }, 
                } 
            }); 
} 
 
public class YAxisConverter : IValueConverter 
{ 
        public object Convert(object value, Type targetType, object parameter, CultureInfo culture) 
        { 
 
            if (value.ToString() == ChannelType.Conductivity.ToString()) 
                return Application.Current.Resources["axis1"]; 
            else if (value.ToString() == ChannelType.Length.ToString()) 
                return Application.Current.Resources["axis2"]; 
            else if (value.ToString() == ChannelType.Pressure.ToString()) 
                return Application.Current.Resources["axis3"]; 
            else  
                return Application.Current.Resources["axis4"]; 
        } 
 
        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) 
        { 
            return value; 
        } 
} 
 
… 
 
 
public enum ChannelType 
{ 
        Pressure, 
        Temperature, 
        Length, 
        Conductivity 
} 
 
 
We have prepared a sample based on this and you can find the sample under the following location: 
Please let us know if you have any queries. 
Regards, 
Muneesh Kumar G. 
 


LR Lukas R March 8, 2018 09:07 AM UTC

Thats exactly what i was looking for! Thank you very much for the fast and very helpful reply.

MK Muneesh Kumar G Syncfusion Team March 9, 2018 11:03 AM UTC

Hi Lukas Raschle, 
 
Thanks for the update. 
  
We are glad to know that the given solution worked. Please get back to us if you need further assistance. 
 
Thanks, 
Muneesh Kumar G. 
 


Loader.
Up arrow icon