My aspx page
<script src="Scripts/jqchart.js" type="text/javascript"></script>
<%--Changes chart --%>
<script type="text/javascript">
$(function () {
var chart;
$(document).ready(function () {
// Radialize the colors
Highcharts.getOptions().colors = $.map(Highcharts.getOptions().colors, function (color) {
return {
radialGradient: {
cx: 0.5,
cy: 0.3,
r: 0.7
},
stops: [
[0, color],
[1, Highcharts.Color(color).brighten(-0.3).get('rgb')] // darken
]
};
});
// Build the chart
chart = new Highcharts.Chart(
{
chart:
{
renderTo: 'container',
fill: false,
plotBackgroundColor: null,
plotBorderWidth: null,
plotShadow: false
},
title: {
text: 'Techsoft Technologies Bangalore, 2013'
},
tooltip: {
pointFormat: '{series.name}: <b>{point.percentage}%</b>',
percentageDecimals: 1
},
highlighter: {
show: true,
sizeAdjust: 7.5
},
plotOptions: {
pie:
{
allowPointSelect: true,
cursor: 'pointer',
dataLabels:
{
enabled: true,
color: '#000000',
connectorColor: '#000000',
formatter: function () {
return '<b>' + this.point.name + '</b>: ' + this.percentage + ' %';
}
}
}
},
series: [
{
type: 'pie',
name: 'Strength',
data: [
['Firefox', 45.0],
['IE', 26.8],
{
name: 'Chrome',
y: 12.8,
////sliced: true,
selected: true
},
['Safari', 8.5],
['Opera', 6.2],
['Others', 0.7]
]
}
]
});
});
});
</script>
<body>
<script src="Scripts/high.js" type="text/javascript"></script>
<script src="Scripts/high1.js" type="text/javascript"></script>
<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto">
</div>
</body>
My CS page
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.Services;
using MySql.Data.MySqlClient;
using System.Web.Script.Serialization;
using System.Web.UI.DataVisualization;
using System.Data;
public partial class Default5 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
[WebMethod]
public static List<Data> GetData()
{
List<Data> dataList = new List<Data>();
MySqlConnection con = new MySqlConnection("Server=localhost;Port=3306;Database=projecttt;UID=root;Pwd=techsoft;pooling=false");
string s = string.Empty;
s = "select name,marks from jqchart";
{
MySqlCommand cmd = new MySqlCommand(s, con);
{
con.Open();
cmd.ExecuteNonQuery();
MySqlDataReader dr = cmd.ExecuteReader();
while (dr.Read())
{
string a = dr[0].ToString();
string b = dr[1].ToString();
dataList.Add(new Data(a, int.Parse(b)));
}
return dataList;
}
}
}
public class Data
{
public string ColumnName = "";
public int Value = 0;
public Data(string columnName, int value)
{
ColumnName = columnName;
Value = value;
}
}
}