1.第一种:后台绑定 前台 var options = new Highcharts.Chart({ chart: { //将报表对象渲染到层上 renderTo: 'container' },title: { text: '' },xAxis: { categories: ['1','2','3','4','5','6','7','8','9','10','11','12','13','14','15','16','17','18','19','20'] },labels: { items: [{ html: 'Total fruit consumption',style: { left: '40px',top: '8px',color: 'black' } }] },series: <%=returnValue %> }); 后台代码 Public string returnValue // if (!IsPostBack) // { //int nowYear = DateTime.Now.Year; //DataTable dt = DataAccessTest.getDataTableBysql("select * from T_BookType where Data>=" + (nowYear - 2) + " and Data<=" + nowYear); //StringBuilder total = new StringBuilder(); //total.Append("["); //for (int i = 0; i < 3; i++) //{ // // json += "{"; // if (nowYear == DateTime.Now.Year) // { // total.Append("{type:'spline',name:'今年',data:["); // } // else if (nowYear == (DateTime.Now.Year - 1)) // { // total.Append("{type:'column',name:'去年',data:["); // } // else // { // total.Append("{type:'column',name:'前年',data:["); // } // // json += "data:"; // string filter = String.Format(" {0}='{1}' ","Data",nowYear);//获取顶级目录. // DataRow[] drs = dt.Select(filter); // foreach (DataRow dr in drs) // { // string percent = dt.Rows[i]["percent"].ToString(); // total.Append( percent + ","); // } // total.Remove(total.Length - 1,1); // total.Append("]},"); // nowYear--; //} //total.Remove(total.Length - 1,1); //total.Append("]"); //seriesData = total.ToString(); // } 2..ajax+json+ashx $(function () { //图表 var options = new Highcharts.Chart({ chart: { //将报表对象渲染到层上 renderTo: 'container' },series: [{ name: '今年',type: 'spline',data:[0,0] },{ name: '去年',type: 'column',data: [0,{ name: '前年',0] }] }); $('#searchButton').click(function () { jQuery.getJSON('DealData/showJson.ashx',null,function (data) { var dataObj = eval(data); alert(dataObj); options.series[0].setData(dataObj[0]); options.series[1].setData(dataObj[1]); options.series[2].setData(dataObj[2]); var chart = new Highcharts.Chart(options); //用前面定义的参数构造一个图表,会自动填充到页面容器中 }); }); }); //生成Json的方法 public static string DataTableMutilJson(DataTable dt) { string json = ""; json += "["; if (dt != null && dt.Rows.Count > 0) { int nowYear = DateTime.Now.Year; for (int i = 0; i < 3; i++) { string filter = String.Format(" {0}='{1}' ",nowYear);//获取顶级目录. DataRow[] drs = dt.Select(filter); json += "["; foreach (DataRow dr in drs) { string percent = dr["percent"].ToString(); json += Double.Parse(percent) + ","; } json = json.Substring(0,json.Length - 1); json += "],"; nowYear--; } json = json.Substring(0,json.Length - 1); json += "]"; } else { json = "[[]]"; } JavaScriptSerializer jsonSerializer = new JavaScriptSerializer(); return jsonSerializer.Serialize(json); // return "\"" + json + "\""; }
Ashx: context.Response.ContentType = "application/json"; int nowYear = DateTime.Now.Year; DataTable dt = DataAccessTest.getDataTableBysql("select * from T_BookType where Data>=" + (nowYear - 2) + " and Data<=" + nowYear); string json = DataAccessTest.DataTableMutilJson(dt); context.Response.Write(json); context.Response.End();原文链接:https://www.f2er.com/ajax/163741.html