Charting a simple table

[John Penn]

Hello,

I am new to the Syncfusion package and I was hoping someone could help me.

I am trying to render a column chart (no AJAX, no postbacks, just an image) from a very simple data set like this:

Fred 300
Joe 234
Bob 177
Steve 123
Mary 95

When I run my code (cobbled together from the various samples) all I get is a narrow blue-background image with the chart title but no chart.

How can I do this with the Syncfusion chart web control? The data table is coming from a SQL Server stored procedure which I know works because I'm using it elsewhere in my application.


Thanks-
John

[John Penn]

OK... I figured out why I was getting the narrow image (note to self - don't use percentage-unit widths for these graphs) but I can't get the column chart to unstack... what I'd like to see is a column for each name in my table.

How can I do this?

>Hello,

I am new to the Syncfusion package and I was hoping someone could help me.

I am trying to render a column chart (no AJAX, no postbacks, just an image) from a very simple data set like this:

Fred 300
Joe 234
Bob 177
Steve 123
Mary 95

When I run my code (cobbled together from the various samples) all I get is a narrow blue-background image with the chart title but no chart.

How can I do this with the Syncfusion chart web control? The data table is coming from a SQL Server stored procedure which I know works because I'm using it elsewhere in my application.


Thanks-
John

[Administrator]

Hi John,

Thank You for your interest in Syncfusion Products.

If your intention is to create a ColumnChart and have the name from the database for each column then it can done by creating a series of Type Column and binding the values in the database to the ChartDataBindAxisLabelModel and then to the ChartAxisLabelModel(i.e to the LabelModel of corresponding ChartAxis).
Kindly take a look at the code snippet below,

ChartSeries series = this.ChartWebControl1.Model.NewSeries("Data Bound Series");
series.Text = series.Name;
series.Type = ChartSeriesType.Column;
series.Points.Add(2001, 10);
series.Points.Add(2002, 13.5);
series.Points.Add(2003, 14.6);
series.Points.Add(2004, 16.5);
series.Points.Add(2005, 18);

this.ChartWebControl1.Series.Add(series);
this.xAxisLabelModel = new ChartDataBindAxisLabelModel(this.ds, "");

this.xAxisLabelModel.LabelName = "Client";//LabelName should assigned the ColumnName of the table in database whose value should be displayed for each column

this.ChartWebControl1.ChartWebArea.PrimaryXAxis.LabelsImpl = this.xAxisLabelModel;
this.ChartWebControl1.ChartWebArea.PrimaryXAxis.ValueType = ChartValueType.Custom;

Let me know whether this helps you.

Thanks & Regards,
Ramya.

[Administrator]

Hi John,

Thank You for your interest in Syncfusion Products.

If your intention is to create a ColumnChart and have the name from the database for each column then it can done by creating a series of Type Column and binding the values in the database to the ChartDataBindAxisLabelModel and then to the ChartAxisLabelModel(i.e to the LabelModel of corresponding ChartAxis).
Kindly take a look at the code snippet below,

ChartSeries series = this.ChartWebControl1.Model.NewSeries("Data Bound Series");
series.Text = series.Name;
series.Type = ChartSeriesType.Column;
series.Points.Add(2001, 10);
series.Points.Add(2002, 13.5);
series.Points.Add(2003, 14.6);
series.Points.Add(2004, 16.5);
series.Points.Add(2005, 18);

this.ChartWebControl1.Series.Add(series);
this.xAxisLabelModel = new ChartDataBindAxisLabelModel(this.ds, "tablename");//tablename->name of table in database

this.xAxisLabelModel.LabelName = "Client";//LabelName should assigned the ColumnName of the table in database whose value should be displayed for each column

this.ChartWebControl1.ChartWebArea.PrimaryXAxis.LabelsImpl = this.xAxisLabelModel;
this.ChartWebControl1.ChartWebArea.PrimaryXAxis.ValueType = ChartValueType.Custom;

Let me know whether this helps you.

Thanks & Regards,
Ramya.

[John Penn]

Hi Ramya,

Thanks for getting back to me on this. I pasted your code into my ASP page, and now the names are appearing underneath the columns as I expected. Now I need to configure the Y-axis to correspond to the 2nd column in my table. How do I do this?

Thanks again-
John

>Hi John,

Thank You for your interest in Syncfusion Products.

If your intention is to create a ColumnChart and have the name from the database for each column then it can done by creating a series of Type Column and binding the values in the database to the ChartDataBindAxisLabelModel and then to the ChartAxisLabelModel(i.e to the LabelModel of corresponding ChartAxis).
Kindly take a look at the code snippet below,

ChartSeries series = this.ChartWebControl1.Model.NewSeries("Data Bound Series");
series.Text = series.Name;
series.Type = ChartSeriesType.Column;
series.Points.Add(2001, 10);
series.Points.Add(2002, 13.5);
series.Points.Add(2003, 14.6);
series.Points.Add(2004, 16.5);
series.Points.Add(2005, 18);

this.ChartWebControl1.Series.Add(series);
this.xAxisLabelModel = new ChartDataBindAxisLabelModel(this.ds, "tablename");//tablename->name of table in database

this.xAxisLabelModel.LabelName = "Client";//LabelName should assigned the ColumnName of the table in database whose value should be displayed for each column

this.ChartWebControl1.ChartWebArea.PrimaryXAxis.LabelsImpl = this.xAxisLabelModel;
this.ChartWebControl1.ChartWebArea.PrimaryXAxis.ValueType = ChartValueType.Custom;

Let me know whether this helps you.

Thanks & Regards,
Ramya.

[Administrator]

Hi John,

If your intention is to display the names of the second column in the database along the Y- Axis then it can be done by binding the values in the database to the ChartDataBindAxisLabelModel. Kindly take a look at the code snippet below,

this.yAxisLabelModel = new ChartDataBindAxisLabelModel(this.ds, "Sheet");
this.yAxisLabelModel.LabelName = "SecondColumn";//Name of second column in database
this.ChartWebControl1.ChartWebArea.PrimaryYAxis.LabelsImpl = this.yAxisLabelModel;
this.ChartWebControl1.ChartWebArea.PrimaryYAxis.ValueType = ChartValueType.Custom;

Let me know if I am wrong in getting your requirement.

Thanks & Regards,
Ramya.