StackedSpline Chart

[Monalisa]

Hi Telerik,

I am using Stacked Spline Chart (2D). Here I bind the chart by fetching value from database using WCF. Now I want to show the Date that are fetch from Database in X-axis. How do I do this and also when mouse over the tooltip will shown with X and Y value.

I tried so much but not getting any result.
My Database contains (PK_ID, Exam_Date, Result).

So I want to plot graph Exam_Date Vs Result.

This is very urgent, kindly reply me.

Below is my coding:

            SeriesMapping sm1 = new SeriesMapping();
            sm1.SeriesDefinition = new StackedSplineSeriesDefinition();
            sm1.LegendLabel = "Exam Result";
             sm1.CollectionIndex = 0;

            ItemMapping im1 = new ItemMapping();
            im1.DataPointMember = DataPointMember.YValue;
                     
            sm1.ItemMappings.Add(im1);

            RadChart1.SeriesMappings.Add(sm1);

            TestDBServiceClient objTestDB = new TestDBServiceClient();
            objTestDB.GetTestCompleted += new EventHandler<GetTestCompletedEventArgs>(objTestDB_GetTestCompleted);
            objTestDB.GetTestAsync();

void objTestDB_GetTestCompleted(object sender, ServiceReference1.GetTestCompletedEventArgs e)
        {
            this.RadChart1.ItemsSource = e.Result;
        }

 

[Ves]

Hello Monalisa,

You can find attached a small example, showing how to populate RadChart with data. You need to create an item mappings for each property in the underlying object, which impacts the graph. In this case there are two properties -- Date and Result. Date defines the position of the item along the X axis, while the result is plotted as item height. You can find more details about the series and item mappings in RadChart here.

Note, that this chart will display a single spline graph. A stacked graph is usually intended to display values summed on top of the corresponding values of the previous series, for ex. ResultPass1 and ResultPass2, where you would be interested in the sum.

Regards,
Ves
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Alan]

Ves,

Could you show how you would add a second series of data to this example so that the chart would show two splines?

I have a project similar to this one using a List<object> as my series data, but when I try to make another one and make the chart's itemsource a List<List<object>>, it fails to run.

Thanks.

Thanks.

[Ves]

Hi Alan,

I have attached an updated version of the example. For second data series you will need a second SeriesMapping. There are two possible approaches:

• As you suggested - List<List<MyObject>>. This way MyObject may have only one property to plot (in this example - Result). For two data series the data source would be a list, which contains two inner lists - the first one for the first series and the second one for the second series. This is defined by the SeriesMapping.CollectionIndex property. This is actually the second chart in the example. Note, that in the datasource object only the Result  property is populated.
• Introduce a second property, which will provide the values for the second series. Now you can use a List<MyObject>. Again - you will need a second SeriesMapping object, but the ItemMapping for YValue would actually map the additional property (Result2 in this example).

Hope this helps.

Kind regards,
Ves
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.

[Alan]

I am not sure what I was doing wrong. It looked like I was doing exactly what you did. I used your code and modified it a little, and it works for me now. Thanks for the help.