Using CanvasJS with ASP.NET C# and SQL

[abraham1973]

Hi,
I developed an application that was showing trend of event for period of years and i want to using CanvasJS to visualize the trend.
The Data’s are return in a DataTable containing Years and Values. I declare the DataTable as public parameter and pass it to Jquery as datapoints: [‘<%=this.mDataTable%>’]
This did not work for me, i have been on this for three(3) weeks now with no result. I need your technical assistance to get this to work.

Thank you

[Suyash Singh]

@abraham1973,

Unless we look into your code, we can’t predict what went wrong in it. Can you kindly create a sample project and share your code, so that we can look into it and help you out.

___
Suyash Singh
Team CanvasJS

[abraham1973]

Many Thanks, i don’t know if i can reply via this medium below is a section of my code that return datatable and convert to JSON

What I have tried:

unit of my code:

`mData = ConnectAll.GetDataObject(“Select sum(totalg9) as Total from tbl_htc2 group by months”);
try
{
var JSONString = new StringBuilder();
if (mData.Rows.Count > 0)
{
JSONString.Append(“[“);
for (int i = 0; i < mData.Rows.Count; i++)
{
JSONString.Append(“{“);
for (int j = 0; j < mData.Columns.Count; j++)
{
if (j < mData.Columns.Count – 1)
{
JSONString.Append(“\”” + mData.Columns[j].ColumnName.ToString() + “\”:” + “\”” + mData.Rows[i][j].ToString() + “\”,”);
}
else if (j == mData.Columns.Count – 1)
{
JSONString.Append(“\”” + mData.Columns[j].ColumnName.ToString() + “\”:” + “\”” + mData.Rows[i][j].ToString() + “\””);
}
}
if (i == mData.Rows.Count – 1)
{
JSONString.Append(“}”);
}
else
{
JSONString.Append(“},”);
}
}
JSONString.Append(“]”);
}

Response.Redirect(string.Format(“~/data_load/monthly_trend.aspx?mData={0}”, JSONString.ToString()));

The page that render the chart :

window.onload = function () {
var mTD = ‘ <%=this.DT%>’
var chart = new CanvasJS.Chart(“chartContainer”,
{
title: {
text: “Trend Analysis”
},
axisY: {
// minimum: 50,
maximum: 300,
interval:50
},
axisX: {
// minimum: 50,
maximum: 200
//interval:-10
},
data: [
{
type: “column”,
dataPoints: [
mTD
]
}
]
});

chart.render();
}

[Suyash Singh]

@abraham1973,

Since you are reading data from the database, it would be helpful if you could share your sample project along with sample data via onedrive. It would help us in understanding your requirements better and help you out.

___
Suyash Singh
Team CanvasJS