legends remain enabled if series changed

[ahraza]

Hey Folks,

I am using sfchart version 15.4

I am facing this problem, see the screenshots attached for clarity.

I have 3 filters, 1 month, 6 months and 12 months . the graph starts with 1 month data (there are 6 series in total and all series are invisible at startup)

Then user taps on the legends to see the series they want to see. which works is fine.

Problem occurs when the user taps the 6 or 12 months button and series data change. The legends remain enabled.

See the zipped file with 4 pics showing the steps and outcome.

This is how i am populating the graph:

        public void PopulateGraph(Dictionary> calculationList)

        {

            try

            {

                _sfchart.Series.Clear();

                _sfchart.PrimaryAxis = GetDateTimeAxis(calculationList);

                foreach (var graphList in calculationList)

                {

                    var series = new SplineSeries();

                    series.ItemsSource = graphList.Value.OrderBy(x => x.xUnit);

                    series.XBindingPath = "xUnit";

                    series.YBindingPath = "yUnit";

                    series.LegendIcon = ChartLegendIcon.Rectangle;

                    series.SplineType = SplineType.Monotonic;

                    var graphCategory = _graphsMasterDetailBasePageViewModel.GraphItems.ToList()

                        .FirstOrDefault(x => x.value.Replace(FormulaStringKeys.InputIdStartingAndEndingKey, "")

                            .Equals(graphList.Key));

                    if (graphCategory != null)

                    {

                        series.Label = graphCategory.label;

                        series.Color = Color.FromHex(graphCategory.color);

                    }

                    series.IsVisible = false;

                    series.IsVisibleOnLegend = true;

                    _sfchart.Series.Add(series);

                }

            }

            catch (Exception e)

            {

                Debug.WriteLine(e); //todo: log later on

            }

        }

As per the impl. above, each time user filters the seires, chart series collection is cleared and then new series data is added to the chart. so legends should also disable each time.

Also is there a way to show only the dates that are in the series. it is showing the dates that are not in the series at the moment. the interval that i have is set to none. i don't want any interval i just want to show only the entries that user filled.

Thanks

Attachment: screenshots_88a94fee.zip

[Divya Venkatesan]

Hi Adil,

We have prepared a sample based on your provided details. The sample works fine and we have attached the sample for your reference. Could you please check with the sample in below location?

Sample: http://www.syncfusion.com/downloads/support/forum/136576/ze/ChartLegendSample2118525151

If still you face the problem, please revert us by modifying the sample based on your application along with replication procedure. This would be helpful for us to serve you.

Regards,
Divya Venkatesan

[ahraza]

Hi Divya,

The sample you attached does not work, it runs, i click on the button on the top. but it shows no graph.

Please have a look at your sample and send a working one.

Thanks

[Divya Venkatesan]

Hi Adil,

Sorry for the inconvenience caused.

The fix for the legend issue has been included in latest SfChart version. Could you please update the SfChart version to latest (16.1.0.26)?

You can find the different options to get the latest version of SfChart component from here.
https://help.syncfusion.com/xamarin/introduction/download-and-installation  

The latest version of SfChart component is available in official nuget server as well.
https://www.nuget.org/packages/Syncfusion.Xamarin.SfChart/  

Regards,
Divya Venkatesan

[ahraza]

Thanks Divya,

I'll try upgrading the component.

Regarding the 2nd part of my question:

"Also is there a way to show only the dates that are in the series. it is showing the dates that are not in the series at the moment. the interval that i have is set to none. i don't want any interval i just want to show only the entries that user filled."

what can we do about that?

Regards,
Adil

[Divya Venkatesan]

Hi Adil,

Your requirement to show only the user entered dates can be achieved by setting CategoryAxis in chart primary axis. You can refer the following user guide link to know more about category axis

https://help.syncfusion.com/xamarin/sfchart/axis#category-axis  

Please let us know if you need any further assistance.

Regards,
Divya Venkatesan

[ahraza]

Hi Divya,

I already tried using the category axis. If i use the category-axis then sure i see only the dates which are returned from the db BUT some series don't appear on correct position on x-axis.

See the 2 pics i am attaching representing same data, wrong (with Category axis) correct (with DateTime axis but with extra dates).

Thanks,
Adil

Attachment: xaxisissue_2553eaf.zip

[Lakshmi Radha Krishnan]

Hi Divya, 

  

We would like to inform you that, the series rendering based on the index value for category axis. However, you may achieve your requirement either by using CategoryAxis or DateTimeAxis with additional settings. 

  

Case1: Using CategoryAxis 

  

If you are using category axis, you need to provide same input data for all the series or can achieve this with empty data points. Please refer the sample data. 

  

  

            DateTime date = new DateTime(2018, 1, 1);

            Data = new ObservableCollection<Model>();
            Data.Add(new Model { Date = date, Value = random.Next(10, 20) });
            date = date.AddMonths(1);
            Data.Add(new Model { Date = date, Value = random.Next(10, 20) });
            date = date.AddMonths(1);
            Data.Add(new Model { Date = date, Value = random.Next(10, 20) });
            date = date.AddMonths(1);
            Data.Add(new Model { Date = date, Value = random.Next(10, 20) }); 

            date = date.AddMonths(1); 

            Data.Add(new Model { Date = date, Value = random.Next(10, 20) }); 

  

            Data1 = new ObservableCollection<Model>();
            Data1.Add(new Model { Date = date, Value = double.NaN });
            date = date.AddMonths(1);
            Data1.Add(new Model { Date = date, Value = double.NaN });
            date = date.AddMonths(1);
            Data1.Add(new Model { Date = date, Value = random.Next(10, 30) });
            date = date.AddMonths(1);
            Data1.Add(new Model { Date = date, Value = random.Next(10, 30) });
            date = date.AddMonths(1);
            Data1.Add(new Model { Date = date, Value = random.Next(10, 30) });  

            date = date.AddMonths(1);
            Data1.Add(new Model { Date = date, Value = random.Next(10, 30) });  

              

 

  

Case2: Using DateTimeAxis  

  

If you are using date time axis, you need to set IntervalType property of the axis to get the exact axis label of the segment. Please refer the sample data. 

  

  

 DateTimeAxis primaryAxis = new DateTimeAxis();
 primaryAxis.IntervalType = DateTimeIntervalType.Months;
 primaryAxis.Interval = 1; 
 chart.PrimaryAxis = primaryAxis;  

  

  DateTime date = new DateTime(2018, 1, 1);

 for (int i = 0; i < 10; i++)
 {
        Data.Add(new Model { Date = date, Value = random.Next(10, 20) });
        Data1.Add(new Model { Date = date, Value = random.Next(30, 40) });
        Data2.Add(new Model { Date = date, Value = random.Next(50, 60) });
        date = date.AddMonths(1);
} 

  

 

   

Regards, 

Lakshmi R.