sfchart not visible and new SfChartRenderer(); method causing app crash in android

[ALOK SHARMA]

Hello All,

i have been trying to use sfchart in my xamarin.forms project (not pcl) . and i am following the examples given in documentation, but the chart is not rendering in my application. while the same code is working in your provided sample projects.
i am using latest Xamarin.Forms 2.3.4.247 and

sfchart from your nuget packages

• syncfusion.xamarin.sfchart 15.2.0.43
  
• Syncfusion.SfChart.Android15.2451.0.43
  
• Syncfusion.SfChart.XForms.Android15.2451.0.43
  
• Syncfusion.SfChart.XForms15.2451.0.43
  

below is code in my project for sfchart :
user history.xaml page

<?xml version="1.0" encoding="utf-8" ?>
<bottomTabs:BottomTabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:chart="clr-namespace:Syncfusion.SfChart.XForms;assembly=Syncfusion.SfChart.XForms"
             xmlns:bottomTabs="clr-namespace:pranjalApp.Renders"
             xmlns:local="clr-namespace:pranjalApp.ViewModels"
             xmlns:Iconize="clr-namespace:FormsPlugin.Iconize;assembly=FormsPlugin.Iconize"
             x:Class="pranjalApp.Views.userHistory" NavigationPage.HasNavigationBar="False">
    <!--Pages can be added as references or inline-->
    <ContentPage Title="Payment History">
        <ContentPage.Content>
            <StackLayout x:Name="pieStack">
                <chart:SfChart x:Name="Chart" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">

                    <chart:SfChart.Title>
                        <chart:ChartTitle Text="Expenditures"/>
                    </chart:SfChart.Title>

                    <chart:SfChart.BindingContext>
                        <local:PieSeriesViewModel />
                    </chart:SfChart.BindingContext>

                    <chart:SfChart.Legend>
                        <chart:ChartLegend/>
                    </chart:SfChart.Legend>

                    <chart:SfChart.Series>
                        <chart:PieSeries ItemsSource="{Binding PieSeriesData}" XBindingPath="Name" YBindingPath="value" StartAngle="75"  EnableAnimation="True"
                         EndAngle ="435" EnableSmartLabels="True" ConnectorLineType = "Bezier" DataMarkerPosition = "OutsideExtended" LegendIcon="Rectangle">
                            <chart:PieSeries.DataMarker>
                                <chart:ChartDataMarker LabelContent="Percentage" ShowLabel="True">
                                    <chart:ChartDataMarker.LabelStyle>
                                        <chart:DataMarkerLabelStyle LabelPosition="Center"/>
                                    </chart:ChartDataMarker.LabelStyle>
                                </chart:ChartDataMarker>
                            </chart:PieSeries.DataMarker>
                        </chart:PieSeries>
                    </chart:SfChart.Series>

                </chart:SfChart>
            </StackLayout>
        </ContentPage.Content>
    </ContentPage>

    <ContentPage Title="Recharge History" >

    </ContentPage>
</bottomTabs:BottomTabbedPage>

userHistory.cs file:

[XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class userHistory : BottomTabbedPage
    {
        public userHistory ()
        {
            InitializeComponent();
            if (!(Device.OS == TargetPlatform.Android || Device.OS == TargetPlatform.iOS))
            {
                Chart.Series[0].AnimationDuration = 2;
                (Chart.Series[0] as PieSeries).StartAngle = 0;
                (Chart.Series[0] as PieSeries).EndAngle = 360;
            }
            Chart.Series[0].BindingContext = new pranjalApp.ViewModels.PieSeriesViewModel();
        }
        protected override void OnPagesChanged(NotifyCollectionChangedEventArgs e)
        {
            base.OnPagesChanged(e);
            
        }
    }

pieseriesviewmodel class:
public class PieSeriesViewModel
    {
        public ObservableCollection<ChartDataModel> PieSeriesData { get; set; }

        public PieSeriesViewModel()
        {
            PieSeriesData = new ObservableCollection<ChartDataModel>
            {
                new ChartDataModel("Other personal", 94658),
                new ChartDataModel("Medical care", 9090),
                new ChartDataModel("Housing", 2577),
                new ChartDataModel("Transportation", 473),
                new ChartDataModel("Education", 120),
                new ChartDataModel("Electronics", 70)
           };
        }
    }

public class ChartDataModel
    {
        private string Expense;
        private int value;

        public ChartDataModel(string Expense, int value)
        {
            this.Expense = Expense;
            this.value = value;
        }
    }

attached is the output image which have nothing visible apart from label. also if i put new SfChartRenderer(); in my mainactivity its crashing my app.

please let me know if you need a sample project or what i am doing wrong in setup?

Attachment: syncfusion_error_eb0fc8f1.7z

[Saravana Pandian Murugan]

Hi Alok,

Thanks for using Syncfusion products.

In the given code snippet, we have found that XBindingPath and YBindingPath were wrongly set and we have modified your sample which can be downloaded from the below location.

Sample: http://www.syncfusion.com/downloads/support/forum/131312/ze/ChartSample2000380585
 
Please check the sample and let us know if you are facing any issue in this.

Regards,
Saravana Pandian M.