Multiple axis stacked

UWP documentation reports that SfChart accept multiple axes arranged in stack or side by side pattern. I am not able to find an example of how to arrange axes in stack pattern.

Could someone please provide me an example?


1 Reply 1 reply marked as answer

YP Yuvaraj Palanisamy Syncfusion Team July 13, 2021 06:56 AM UTC

Hi Zulu, 
 
Greetings from Syncfusion. 
 
We would like to let you that the requirement “Multiple axis with stacked position” has been achieved using multiple axis support as per the below code example. 
 
CodeSnippet: 
<sfchart:SfChart> 
    <sfchart:SfChart.RowDefinitions> 
        <sfchart:ChartRowDefinition/> 
        <sfchart:ChartRowDefinition Height="15" Unit="Pixels"/> 
        <sfchart:ChartRowDefinition/> 
        <sfchart:ChartRowDefinition Height="15" Unit="Pixels"/> 
        <sfchart:ChartRowDefinition/> 
    </sfchart:SfChart.RowDefinitions> 
 
    <sfchart:SfChart.PrimaryAxis> 
        <sfchart:NumericalAxis Header="Column_XAxis"/> 
    </sfchart:SfChart.PrimaryAxis> 
 
    <sfchart:SfChart.SecondaryAxis> 
        <sfchart:NumericalAxis Header="Column_YAxis"/> 
    </sfchart:SfChart.SecondaryAxis> 
 
    <sfchart:ColumnSeries x:Name="column"  
                             Interior="#FF757CBB"  
                             ItemsSource="{Binding ScatterData}"  
                             XBindingPath="Price"  
                             YBindingPath="Value" > 
 
    </sfchart:ColumnSeries> 
 
    <sfchart:ScatterSeries ItemsSource="{Binding ScatterData}" 
                           XBindingPath="Price" 
                           YBindingPath="Value" 
                           ScatterHeight="10" 
                           ScatterWidth="10"> 
        <sfchart:ScatterSeries.XAxis> 
            <sfchart:NumericalAxis Header="Scatter_XAxis"/> 
        </sfchart:ScatterSeries.XAxis> 
        <sfchart:ScatterSeries.YAxis> 
            <sfchart:NumericalAxis Header="Scatter_YAxis" sfchart:SfChart.Row="2" Minimum="0" Maximum="12"/> 
        </sfchart:ScatterSeries.YAxis> 
    </sfchart:ScatterSeries> 
 
    <sfchart:LineSeries ItemsSource="{Binding ScatterData}" 
                           XBindingPath="Price" 
                           YBindingPath="Value"> 
        <sfchart:LineSeries.XAxis> 
            <sfchart:NumericalAxis Header="Line_XAxis"/> 
        </sfchart:LineSeries.XAxis> 
        <sfchart:LineSeries.YAxis> 
            <sfchart:NumericalAxis Header="Line_YAxis" sfchart:SfChart.Row="4" Minimum="0" Maximum="12"/> 
        </sfchart:LineSeries.YAxis> 
    </sfchart:LineSeries> 
</sfchart:SfChart> 
 
Also, we have attached the sample for your reference. Please find the sample from the below link. 
 
  
Output: 
 
 
For more details, please refer the below link. 
 
Regards, 
Yuvaraj. 


Marked as answer
Loader.
Up arrow icon