你的位置:首页 > ASP.net教程

[ASP.net教程]c# HighCharts使用


最近接到个图形报表的需求,网络上找了几个插件,最后决定用highcharts

需要的文件 

1、bll文件,添加到项目引用   http://files.cnblogs.com/files/lovejunjuan/HighChartsMvc.Model.rar

2、js文件,在项目中添加引用   http://files.cnblogs.com/files/lovejunjuan/highcharts.js

 

引用bll文件

@using HighChartsMvc.Model.Chart;
@using HighChartsMvc.Model.Chart.SeriesStlye;

 

引用js文件

<script src="@Url.Content("~/Content/Highcharts-4.2.6/js/highcharts.js")" type="text/javascript"></script>

 

ajax从后台获取数据绑定到控件

$.ajax({    type: 'get',    url: durl,//请求数据的地址    success: function (data) {      var json = eval("(" + data + ")");      alert(json);      var s = 1;      for (var key in json.list) {        json.list[key].y = json.list[key].age; //给Y轴赋值        xtext = json.list[key].name;//给X轴TEXT赋值        json.list[key].color = color[key];      }      chart.series[0].setData(json.list);//数据填充到highcharts上面    },    error: function (e) {    }  });  var chart = new Highcharts.Chart({    chart: {      renderTo: 'container',      type: 'column' //显示类型 柱形,可修改为其他类型,饼图曲线图等,数据绑定方式都一样,非常方便    },    title: {      text: '产量分布图' //图表的标题    },    xAxis: {      categories: xtext    },    yAxis: {      title: {        text: '产量' //Y轴的名称      },    },    series: [{      name: "产量"    }]  });

json数据格式

public string DataTableToJson(DataTable dt)    {      StringBuilder jsonBuilder = new StringBuilder();      jsonBuilder.Append("{\"");      jsonBuilder.Append("list");      jsonBuilder.Append("\":[");            for (int i = 0; i < dt.Rows.Count; i++)      {        jsonBuilder.Append("{");        for (int j = 0; j < dt.Columns.Count; j++)        {          jsonBuilder.Append("\"");          jsonBuilder.Append(dt.Columns[j].ColumnName);          jsonBuilder.Append("\":");          //jsonBuilder.Append("\":\"");          //判断下是否纯数字,highcharts插件不是纯数字的值要加双引号          if (IsNumber(dt.Rows[i][j].ToString()))          {            jsonBuilder.Append(dt.Rows[i][j].ToString());          }          else          {            jsonBuilder.Append("\"");            jsonBuilder.Append(dt.Rows[i][j].ToString());            jsonBuilder.Append("\"");          }          jsonBuilder.Append(",");          //jsonBuilder.Append("\",");        }        jsonBuilder.Remove(jsonBuilder.Length - 1, 1);        jsonBuilder.Append("},");      }      jsonBuilder.Remove(jsonBuilder.Length - 1, 1);      jsonBuilder.Append("]");      jsonBuilder.Append("}");      return jsonBuilder.ToString();    }

其他参数没有过多研究,可查看官网