Hi maideen,
Check this example. Now please take its reference and correct your code.
Database
For this example I have used of Northwind database that you can download using the link given below.
Download Northwind Database
HTML
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
var chartData_P;
google.charts.load('current', { 'packages': ['corechart'] });
$(document).ready(function () {
$.ajax({
url: "Default.aspx/GetChartData",
data: "{}",
dataType: "json",
type: "POST",
contentType: "application/json; chartset=utf-8",
success: function (data) {
chartData_P = data.d;
},
error: function () {
alert("Error loading data! Please try again.");
}
}).done(function () {
google.setOnLoadCallback(drawChart_P);
drawChart_P();
});
});
function drawChart_P() {
var data = google.visualization.arrayToDataTable(chartData_P);
var options = {
//title: "Company Revenue-Year",
pointSize: 5
};
var pieChart = new google.visualization.ColumnChart(document.getElementById('line_chart_1'));
pieChart.draw(data, options);
}
</script>
<div id="line_chart_1" style="width: 900px; height: 500px;">
</div>
Namespaces
C#
using System.Configuration;
using System.Data;
using System.Data.SqlClient;
using System.Web.Services;
VB.Net
Imports System.Configuration
Imports System.Data
Imports System.Data.SqlClient
Imports System.Web.Services
Code
C#
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
HttpCookie nameCookie = new HttpCookie("Country");
nameCookie.Values["Country"] = "USA";
nameCookie.Expires = DateTime.Now.AddDays(30);
Response.Cookies.Add(nameCookie);
}
}
[WebMethod]
public static List<object> GetChartData()
{
string query = "SELECT ShipCity, COUNT(orderid) TotalOrders";
query += " FROM Orders WHERE ShipCountry = @Country GROUP BY ShipCity";
string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
List<object> chartData = new List<object>();
chartData.Add(new object[]
{
"ShipCity", "TotalOrders"
});
using (SqlConnection con = new SqlConnection(constr))
{
using (SqlCommand cmd = new SqlCommand(query))
{
cmd.CommandType = CommandType.Text;
cmd.Parameters.AddWithValue("@Country", HttpContext.Current.Request.Cookies["Country"].Value.Split('=')[1]);
cmd.Connection = con;
con.Open();
using (SqlDataReader sdr = cmd.ExecuteReader())
{
while (sdr.Read())
{
chartData.Add(new object[]
{
sdr["ShipCity"], sdr["TotalOrders"]
});
}
}
con.Close();
return chartData;
}
}
}
VB.Net
Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
If Not IsPostBack Then
Dim nameCookie As HttpCookie = New HttpCookie("Country")
nameCookie.Values("Country") = "USA"
nameCookie.Expires = DateTime.Now.AddDays(30)
Response.Cookies.Add(nameCookie)
End If
End Sub
<WebMethod()>
Public Shared Function GetChartData() As List(Of Object)
Dim query As String = "SELECT ShipCity, COUNT(orderid) TotalOrders"
query += " FROM Orders WHERE ShipCountry = @Country GROUP BY ShipCity"
Dim constr As String = ConfigurationManager.ConnectionStrings("constr").ConnectionString
Dim chartData As New List(Of Object)()
chartData.Add(New Object() {"ShipCity", "TotalOrders"})
Using con As New SqlConnection(constr)
Using cmd As New SqlCommand(query)
cmd.CommandType = CommandType.Text
cmd.Parameters.AddWithValue("@Country", HttpContext.Current.Request.Cookies("Country").Value.Split("="c)(1))
cmd.Connection = con
con.Open()
Using sdr As SqlDataReader = cmd.ExecuteReader()
While sdr.Read()
chartData.Add(New Object() {sdr("ShipCity"), sdr("TotalOrders")})
End While
End Using
con.Close()
Return chartData
End Using
End Using
End Function
Screenshot