Try this sample
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication1.WebForm1" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="angular.min.js"></script>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/d3/3.2.2/d3.v3.min.js"></script>
<script src="uvcharts.js"></script>
<script src="jquery.min.js"></script>
<script>
function getDataFromServer() {
$.ajax({
type: "POST",
url: "WebForm1.aspx/GetData",
contentType: 'application/json; charset=utf-8',
dataType: 'json',
error: function () {
alert("error");
},
success: function (result) {
var data = JSON.parse(result.d);
var graphdef = {
categories: ['uvCharts'],
dataset: {
'uvCharts': data
}
};
uv.chart('Bar', graphdef);
}
});
}
$(function () {
getDataFromServer();
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="uv-div"></div>
</form>
</body>
</html>
public partial class WebForm1 : System.Web.UI.Page
{
[System.Web.Services.WebMethod]
public static string GetData()
{
List<UVChartValues> lst = new List<UVChartValues>();
lst.Add(new UVChartValues() { name = "2010", value = 32 });
lst.Add(new UVChartValues() { name = "2011", value = 42 });
lst.Add(new UVChartValues() { name = "2012", value = 52 });
lst.Add(new UVChartValues() { name = "2013", value = 62 });
lst.Add(new UVChartValues() { name = "2014", value = 72 });
return new JavaScriptSerializer().Serialize(lst);
}
}
public class UVChartValues
{
public string name { get; set; }
public int value { get; set; }
}