星空网 > 软件开发 > 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='/images/loading.gif' data-original="@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();    }

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




原标题:c# HighCharts使用

关键词:C#

C#
*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

Amazon Live好处这么多,你还不会用?:https://www.ikjzd.com/articles/111780
黑五有人爆单有人愁,遇到跟卖怎么办?:https://www.ikjzd.com/articles/111781
跨境电商代运营靠谱吗?如何避免被坑?:https://www.ikjzd.com/articles/111782
黑五卖家图鉴:小卖家爆单很难!:https://www.ikjzd.com/articles/111784
注意查收:12月海关经贸新规汇总!:https://www.ikjzd.com/articles/111785
突遇亚马逊审核,用这个模版快速完成申诉!:https://www.ikjzd.com/articles/111786
TikTok斥资210万美元游说美国参议院阻止法案通过 :https://www.kjdsnews.com/a/1836653.html
TikTok斥资210万美元游说美国参议院阻止法案通过 :https://www.goluckyvip.com/news/188220.html
相关文章
我的浏览记录
最新相关资讯
海外公司注册 | 跨境电商服务平台 | 深圳旅行社 | 东南亚物流