Using Sql Server
CREATE TABLE [dbo].[tblChart]( [id] [bigint] IDENTITY(1,1) NOT NULL,
SET IDENTITY_INSERT [dbo].[tblChart] ON
SET IDENTITY_INSERT [dbo].[tblChart] ON
In .aspx Page:
<head id="Head1" runat="server">
<title>Line Chart </title>
<script type="text/javascript"
src="https://www.google.com/jsapi"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Literal ID="lt" runat="server"></asp:Literal>
</div>
<div id="divLineChart"></div>
</form>
</body>
In .aspx.cs Page:
SqlConnection Conn = new
SqlConnection(System.Configuration.ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString);
StringBuilder str = new
StringBuilder();
protected void
Page_Load(object sender, EventArgs e)
{
Conn.Open();
if (!IsPostBack)
{
bindChart();
}
}
private void
bindChart()
{
SqlDataAdapter da = new
SqlDataAdapter("select
* from tblChart", Conn);
DataTable dt = new
DataTable();
try
{
da.Fill(dt);
// This code write in javascript code in .aspx page..
// and we can write in code page also..
// this code i am catching in the stringbuilder class
//data.addColumn('string'(datatype), 'Year'(columnname
according to the sql table));
//data.addColumn('number'(datatype), 'Sales'(columnname
according to the sql table));
//data.addColumn('number'(datatype), 'Expenses'(columnname
according to the sql table));
// This data is coming from the sql server
str.Append(@"<script type=text/javascript>
google.load( *visualization*, *1*, {packages:[*corechart*]});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = new
google.visualization.DataTable();
data.addColumn('string',
'Year');
data.addColumn('number',
'Sales');
data.addColumn('number',
'Expenses');
data.addRows(" + dt.Rows.Count + ");");
Int32 i;
for (i = 0; i <= dt.Rows.Count - 1; i++)
{
str.Append("data.setValue( "
+ i + "," + 0 + "," + "'"
+ dt.Rows[i]["year"].ToString() + "');");
str.Append("data.setValue("
+ i + "," + 1 + "," + dt.Rows[i]["sales"].ToString() + ")
;");
str.Append(" data.setValue("
+ i + "," + 2 + "," + dt.Rows[i]["expences"].ToString() + ");");
}
str.Append("var
chart = new
google.visualization.LineChart(document.getElementById('divLineChart'));");
str.Append("chart.draw(data, {width:
650, height: 300, legend: 'bottom',is3D: false,title: 'Performance',");
str.Append("vAxis: {title: 'Year',
titleTextStyle: {color: 'green'}}");
str.Append("}); }");
str.Append("</script>");
lt.Text = str.ToString().TrimEnd(',').Replace('*', '"');
Conn.Close();
}
catch
{ }
finally
{Conn.Close();}
}
This comment has been removed by the author.
ReplyDeleteHi,
ReplyDeleteWe are looking for good quality line chart. We have gone through your trial line chart. But we need example chart for satisfied all requirement below features. Looking forward for your response at earliest.
Note: We are using Asp.net 4.0 and we are data binding from database into line chart.
Features expected in the chart :
1. Should have all common graph types like line, bar, column, Pie. And good to have graph types like Area, Circular, Distribution, Financial, Funnel, Range etc.,
2. Combination of charts should be possible
3. Animations like call outs should be available (It will be helpful if tabular format can be displayed in chart or callout)
4. Multiple Y axis should be possible
5. No of points on y axis should be in our control
6. We should be allowed to set interval on Y axis
7. Minimum and maximum values should be allowed to set by us
8. Data should be coming from database
9. Labels for each data point should be possible
10. Tool tip should be available
11. Data Points should be clickable and navigation to another graph or another page should be possible.
12. Drill down of graphs should be possible
13. Smart labels should be available
14. Markers should be available.
Regards,
Silambarasan .B
its not work me its only show a white blank page
ReplyDeletepls send a code my mail rockroy93@gmail.com
ReplyDelete