Two Graphic with two X-Axis

[Luis Perez Jimenez]

Hi,

I'm testing the Syncfusion package, because my customer needs to show one graphics as the image

I looked that with the control is possible to show two graphics, but with the same X-Axis.

It's possible to do the proposal design?

Thx

[Suyamburaja Jayakumar]

Hi Luis Perez Jimenez, 

 

Greetings from Syncfusion. 

 

We would like to let you know that the series has been rendered based on the PrimaryAxis and SecondaryAxis of SfChart and you can specify the additional axis for that series using XAxis and YAxis properties of ChartSeries as per in below code snippet. 

 

XAML: 

<chart:SfChart.Series> 

 

            <chart:SplineSeries ItemsSource="{Binding Data}" XBindingPath="XValue" YBindingPath="YValue1" Color="#6192f2" StrokeWidth="3"> 

                <chart:SplineSeries.DataMarker> 

                    <chart:ChartDataMarker MarkerWidth="20" MarkerHeight="20"  ShowLabel="false" ShowMarker="true" MarkerBorderColor="White" MarkerBorderWidth="3" MarkerColor="#6192f2"> 

                    </chart:ChartDataMarker> 

                </chart:SplineSeries.DataMarker> 

            </chart:SplineSeries> 

 

            <chart:SplineSeries ItemsSource="{Binding Data}" XBindingPath="XValue" YBindingPath="YValue2" Color="#d938d6" StrokeWidth="3"> 

                <chart:SplineSeries.YAxis> 

                    <chart:NumericalAxis OpposedPosition="true" RangePadding="Additional" Minimum="15" Maximum="23" Interval="2" EdgeLabelsVisibilityMode="Default"> 

                        <chart:NumericalAxis.LabelStyle> 

                            <chart:ChartAxisLabelStyle TextColor="#d938d6" FontSize="17"/> 

                        </chart:NumericalAxis.LabelStyle> 

                    </chart:NumericalAxis> 

                </chart:SplineSeries.YAxis> 

                <chart:SplineSeries.DataMarker> 

                    <chart:ChartDataMarker MarkerWidth="20" MarkerHeight="20"  ShowLabel="false" ShowMarker="true" MarkerBorderColor="White" MarkerBorderWidth="3" MarkerColor="#d938d6"> 

                    </chart:ChartDataMarker> 

                </chart:SplineSeries.DataMarker> 

            </chart:SplineSeries> 

 

        </chart:SfChart.Series> 

 

Screenshot: 

 

 

Sample link: https://www.syncfusion.com/downloads/support/forum/156316/ze/Chart_GettingStarted54000835.zip  

 

To More information please refer the below UG link 

https://help.syncfusion.com/xamarin/charts/chartseries#multiple-series 

 

Please let us know if you need any further assistance on this. 

 

Regards, 

Suyamburaja J.