Hi Team,
public class Service{
public string ServiceName{get;set;}
public string List {get;set;}
}
In which each service has a list of reports.Report structure is as below
public class Report{
public string ReportName{get;set;}
public int density{get;set;}
On X axis i wanted the service name that has list of report bars grouped together with the same colour of service, report bars are based on density value.
on xaxis service names should show up.
on report bars on the tooltip report name should be displayed
In simple words i wanted to display all the reports under services.But all services under a report should have the same colour and must be grouped.Also attached the screen shot of the requirement i need.
Tried the same way but it is not working as expected
Waiting for your help on this.Thanks in advance for all you do
Regards.
Sridhar
In the above mentioned structure the Service class is as follows.
Public class service
{
Public string service name{get;set;}
Public List<Report> Reports{get;set;}
Hello Sridhar,
Thank you for your post(s).
Unfortunately, this is not the way that the XamDataChart works with its ColumnSeries elements. The amount of ColumnSeries used for a particular category on the axis depends on the number of ColumnSeries elements that you have in your XamDataChart.Series collection, and for this to work, you would need a separate ValueMemberPath for each of the column series so that you could "group" by the services in your chart.
For your requirement to work, I would recommend having a separate class, or perhaps a DataTable with the number of value-properties (or columns) equal to the maximum number of reports in one of your services. Using this, you can have X number of ColumnSeries in your XamDataChart, where X is that number of value-properties or columns. For the "services" that don't have the maximum amount of reports, you can set the value for those reports to "0" or "null" if you use a nullable type, and the columns for that particular service will not show for the values that are null or 0, assuming you set the MinimumValue of your NumericYAxis to 0.
What this will do, is it will allow you to have multiple columns in your chart existing for each service in the chart. The issue now, is that each of these columns will be a different color for that particular service. This issue can be eliminated by handling the AssigningCategoryStyle event of the ColumnSeries. This allows you to color the columns of a column series individually, and to handle this event, you need to opt into it by setting the IsCustomCategoryStyleAllowed property of your ColumnSeries to "true" and then hook the event normally.
From the event arguments of this event, you can get the data item that a particular column represents, and color it according to the service that it represents in your application. The tooltip can also be set here, or on the ColumnSeries by setting the ToolTip property to a ContentControl of your creation.
I have attached a sample project that demonstrates how this can be done. I hope this helps you.
Please let me know if you have any other questions or concerns on this matter.
Sincerely,AndrewAssociate Developer
I am aware of the structure that you are currently using, but the hierarchical structure of your data source will not work correctly with the XamDataChart with the way that the chart is currently implemented.
From my understanding, you are trying to have the columns of the XamDataChart be represented by the Report objects that belong to your Services, and have the labels on the CategoryXAxis represent the service. For this to work with the current implementation of the chart, you will need to make sure that your data items are of the type Service, and that would not happen here, as your data items would currently be your reports, because the reports are what carry the ValueMemberPath for your ColumnSeries elements. In other words, binding your CategoryXAxis and your ColumnSeries elements to a collection of type "Service" here would not work in the XamDataChart with the current way that you have your service class set up.
This is why, in the sample project I had sent you, I had recommended that you utilize an external class or data table that has all of the information for the ValueMemberPaths and the services that those Report values belong to, because the XamDataChart has no way of parsing the hierarchy that is currently set up by your current "Service" class. That is what the SampleData class in the sample project I had sent you was meant to mimic. The issue here now becomes that since you are dynamically adding and removing your reports, you need a way to add a new ValueMemberPath dynamically to the data source so that you can add a new series representing that particular value path. Using a DataTable as a data source may help with this, as you could dynamically add columns to your data table programmatically for this purpose as you add reports to your service.
Regarding actually dynamically adding the ColumnSeries, the static series in the sample project were just there to show that this example works in the way that you wanted. The ColumnSeries can be created and added dynamically to the XamDataChart.Series collection if you wish to add more series to it. As an alternative, you can also use the SeriesBinder behavior for dynamic series creation that is discussed at the following forum thread: http://www.infragistics.com/community/forums/t/97638.aspx.
Hello Andrew,
Thanks a lot for your help extended.
I have tried binding a data table but it is not working as expected.Can you please provide a sample of data table binding.
Thanks in advance for all you do.
Forgot to Mention that the data table number of columns should be dynamic.
Regards,
Sridhar.
I have attached a sample project to demonstrate binding of a XamDataChart to a data table. In this sample, the number of columns is dynamic, as there is a button that allows you to add new columns, and thus, new series to the chart.
It is worth noting that it is not possible to bind directly to the DataTable, as the ItemsSource properties of the series and the axes expect an IEnumerable derivation. You can, however, bind to the default view of the DataTable.
I hope this helps you. Please let me know if you have any other questions or concerns on this matter.
Hi Andrew,
Thanks a lot for your support .
I have taken your sample and modified it for bar series as mentioned below.
One issue i have found is i need to group the reports based on the service .Where can i specify the group by option in the mentioned graph.
Currently for all the reports i am getting service Name on the X axis .I wanted the reports to be grouped under a single service Name.
Code Behind File:
using System.Windows;using System.Windows.Controls;using System.Windows.Data;using System.Windows.Documents;using System.Windows.Input;using System.Windows.Media;using System.Windows.Media.Imaging;using System.Windows.Shapes;using Infragistics.Controls.Charts;
namespace XamDataChartServiceReportsCase{ /// <summary> /// Interaction logic for DataTableTest.xaml /// </summary> public partial class DataTableTest : Window { Random r = new Random(); DataTable table = new DataTable(); public DataTableTest() { InitializeComponent(); table.Columns.Add(new DataColumn("Label", typeof(string))); table.Columns.Add(new DataColumn("Value", typeof(int))); table.Columns.Add(new DataColumn("Report", typeof(string))); for(int i=0; i<5; i++) { DataRow row = table.NewRow();
row["Label"] = "Service " + Convert.ToString(1); row["Report"] = "Report " + i.ToString(); row["Value"] = r.Next(1, 5);
table.Rows.Add(row); }
for (int i = 0; i < 5; i++) { DataRow row = table.NewRow();
row["Label"] = "Service " + Convert.ToString(2); row["Report"] = "Report " + i.ToString(); row["Value"] = r.Next(6, 12);
this.DataContext = table; }
int count = 1; private void addColumnBtn_Click(object sender, RoutedEventArgs e) { count++; table.Columns.Add(new DataColumn("Value" + count.ToString(), typeof(int))); for(int i=0; i<table.Rows.Count; i++) { DataRow row = table.Rows[i]; row["Value" + count.ToString()] = r.Next(1, 10); }
LineSeries series = new LineSeries() { XAxis = xAxis, YAxis = yAxis, ItemsSource = table.DefaultView, ValueMemberPath = "Value" + count.ToString() }; chart.Series.Add(series); } }}
Xaml File:
<Window x:Class="XamDataChartServiceReportsCase.DataTableTest" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:ig="http://schemas.infragistics.com/xaml" Title="DataTableTest" Height="300" Width="300"> <Grid> <Grid.Resources> <ContentControl x:Key="theTooltip"> <StackPanel Orientation="Vertical"> <StackPanel Orientation="Horizontal"> <TextBlock Text="Service: " FontWeight="Bold"/> <TextBlock Text="{Binding Item.Label}"/> </StackPanel> <StackPanel Orientation="Horizontal"> <TextBlock Text="Report: " FontWeight="Bold"/> <TextBlock Text="{Binding Item.Report}"/> </StackPanel> </StackPanel> </ContentControl>
</Grid.Resources> <Grid.RowDefinitions> <RowDefinition/> <RowDefinition Height="40"/> </Grid.RowDefinitions> <ig:XamDataChart x:Name="chart"> <ig:XamDataChart.Axes> <ig:CategoryXAxis x:Name="xAxis" ItemsSource="{Binding DefaultView}" Label="{}{Label}"/> <ig:NumericYAxis x:Name="yAxis" MinimumValue="0" MaximumValue="10"/> </ig:XamDataChart.Axes> <ig:XamDataChart.Series> <ig:ColumnSeries XAxis="{Binding ElementName=xAxis}" YAxis="{Binding ElementName=yAxis}" ItemsSource="{Binding DefaultView}" ValueMemberPath="Value" ToolTip="{StaticResource theTooltip}"/>
</ig:XamDataChart.Series> </ig:XamDataChart> <!--<Button x:Name="addColumnBtn" Content="Add Column/Series" Click="addColumnBtn_Click" Grid.Row="1"/>-->
</Grid></Window>
It appears from the structure of your code and the appearance of your chart that you are adding multiple rows in your DataTable with the same service name. The chart will not recognize this as a group, but it will recognize each as its own separate category item. This is why you are seeing multiple duplicate Service names in your chart, and why you are seeing a single, flat color for your single column series.
There is no built-in functionality at the moment to group by a given label path in the XamDataChart for the ColumnSeries, and so I would recommend that you have a single row in your data table for each service, but have multiple columns that represent the Report values for that particular service. At that point, you can have multiple column series that point at each of these value paths, which will group your chart by your service names. This will work to group your service names because you will only have a single service category item for each service, but with multiple value paths, and so multiple column series would need to be shown for each. This way is much like the original way that I had sent you, where there was a value path for Report1, Report2, and Report3, but with the usage of the DataTable, this becomes much more dynamic, as you can add more columns and therefore, more value paths.
If you would like to see category-grouping functionality included for the XamDataChart's column series, I would recommend suggesting a new product idea for this functionality at http://ideas.infragistics.com. This product ideas site places you in direct communication with our product management teams who plan and prioritize upcoming features and products based on community and user feedback.