1. Home
  2. Forum
  3. Xamarin.Forms
  4. Single itemsource and two series

Single itemsource and two series

Hi,

I have a single itemsource but i need to create two series based on the product. Say for product A, based on date one value and for product B, another value.

How will we show it

5 Replies
PS Parthiban Sundaram Syncfusion Team November 14, 2017 12:13 PM UTC

Hi Shermin, 
 
Thanks for using Syncfusion products. 
 
You can achieve this requirement with the help YBindingPath in the chart series to pass the different arguments from the single ItemsSource collection. Please refer the following code snippet for more details. 
 
Code Snippet: 
 
Model 
 
    public class Model 
    { 
        public DateTime XValue { get; set; } 
        public double YValueA { get; set; } 
        public double YValueB { get; set; } 
        public Model(DateTime xValue, double yValueA, double yValueB) 
        { 
            XValue = xValue; 
            YValueA = yValueA; 
            YValueB = yValueB; 
        } 
    } 
 
ViewModel: 
 
            DataPoints = new ObservableCollection<Model>() 
            { 
                new Model(date, 20, 10), 
                new Model(date.AddDays(1), 25, 15), 
                new Model(date.AddDays(2), 15, 10), 
                new Model(date.AddDays(3), 30, 20), 
                new Model(date.AddDays(4), 20, 10) 
            }; 
 
XAML 
 
     
<chart:SfChart.Series> 
      <chart:LineSeries ItemsSource="{Binding DataPoints}" XBindingPath="XValue" YBindingPath="YValueA" Label = "Product A"/> 
      <chart:LineSeries ItemsSource="{Binding DataPoints}" XBindingPath="XValue" YBindingPath="YValueB" Label = "Product B"/> 
    </chart:SfChart.Series> 
  
 
We have also prepared the sample based on your requirement. Please download it from the following location. 
 
 
Please let us know, if you need further assistance on this. 
 
Regards, 
Parthiban S. 


SH shermin December 6, 2017 08:20 AM UTC

Hi,

 How will I show this value in a series in chart(xamarin)

Date      Product  Publisher value
06Dec   Cond      PubA          2
06Dec   Cond      PubB         3
06Dec   Cond      PubC         4

Same Date multiple values .How to show different publisher value in a single date.I cannot add multiple series because this publisher numbers can be changed.
Date in X axis and Value in Y axis and show differnet publisher. How to to ?

DV Divya Venkatesan Syncfusion Team December 7, 2017 09:21 AM UTC

Hi Shermin,

You can show different publisher value for single date using StackingColumnSeries. We have prepared a sample based on this.

Sample: http://www.syncfusion.com/downloads/support/forum/134418/ze/ChartGettingStarted711412605

Please check the attached sample and let us know if you need further assistance on this.

Regards,
Divya Venkatesan


SH shermin December 11, 2017 05:47 AM UTC

Hi Divya,

 I mentioned in my question publisher can be changed. So how will I add multiple series. It can be 3 for one date and 1 for another date. So with your example it will not work.
Date      Product  Publisher value

06Dec   Cond      PubA          2
06Dec   Cond      PubB         3
06Dec   Cond      PubC         4

07Dec   LPG       PubA          1

This is the Data.

Thanks,
Shermin

DV Divya Venkatesan Syncfusion Team December 13, 2017 05:06 PM UTC

Hi Shermin,  
 
We have visualized your data using stacking column chart. Please refer this screenshot.  
 
 
 
Also, you can download the sample from the below link. 
 
 
We have used to following features in this sample.  
 
Used to display the product code and publisher name of the respective segment.  
 
It displays the icon and name of each publisher at top of the legend. It is used identify the publisher name using the color.  
 
It is used to display the date of each segment at X scale.  
 
This feature allows to display only recent 10 days data in view and you can scroll left to right to view the previous day’s data.  
 
Configured the interval and internal type in date time axis to display axis label for each day.  
 
Additionally, the DateTimeAxis label is formatted using LabelFormat property of ChartAxisLabelStyle to display month name and day in X axis.  
  
Regards, 
Divya Venkatesan 


Loader.
Up arrow icon