图表在一个系统中是必须的，MVC架构把它当然是一个扩展集成了进来，通过简单的几句话就可以生成一个风格多样的图表，这给报表的开发带来了很大的方便，大叔的项目中也做了一个测试，把主要的代码贴出来，和大家分享一下。
首先一个Action，返回你需要的图表
public void Chart(string type = "Column") { new Chart(width: 600, height: 400, theme: ChartTheme.Green) .AddTitle("人员流动情况") .AddSeries(name: "Employee" , chartType: type//Column,Pie , xValue: new[] { "一月份", "二月份", "三月份", "四月份", "五月份", "六月份", "七月份", "八月份", "九月份" } , yValues: new[] { "2", "6", "4", "5", "3", "4", "9", "2", "5" }) .Write(); }
代码中的cartType表示图表的类型，一般也就是Column(柱状),Pie(饼状）,Range（范围）等等。
几种常用的图表截图
柱形
饼形
范围
如果你希望将数据库的数据生成图表，需要将名称字段和统计字段放到一个匿名的IEnumerable<T>集合里，例如
/// <summary> /// 通过数据生成图表 /// </summary> /// <param name="type"></param> public void DataChart(string type) { var total = productList.Select(i => new { Name = i.Name, Price = i.UnitPrice }).ToList();//必须要ToList()操作 new Chart(width: 600, height: 400, theme: ChartTheme.Green) .AddTitle("人员流动情况") .AddSeries(name: "Employee" , chartType: string.IsNullOrWhiteSpace(type) ? "Column" : type)//Column,Pie,Range,Stock,Point,Area .DataBindTable(total, "Name") .Write(); }
结果如下
当然如果你要设计多维度报表，你需要让你的IEnumerable<T>对象存在多个元素即可，也就是说，它里面的元素除了一个"Ｘ-Field"，其它的都是维度字段，所以要根据情况去使用。
而如果各位还需要其它的图表类型，还可以参数下拉的参数列表
| 说明 | |
|---|---|
| Area |
面积图类型。 |
| Bar |
条形图类型。 |
| BoxPlot |
盒须图类型。 |
| Bubble |
气泡图类型。 |
| Candlestick |
K 线图类型。 |
| Column |
柱形图类型。 |
| Doughnut |
圆环图类型。 |
| ErrorBar |
误差条形图类型。 |
| FastLine |
快速扫描线图类型。 |
| FastPoint |
快速点图类型。 |
| Funnel |
漏斗图类型。 |
| Kagi |
卡吉图类型。 |
| Line |
折线图类型。 |
| Pie |
饼图类型。 |
| Point |
点图类型。 |
| PointAndFigure |
点数图类型。 |
| Polar |
极坐标图类型。 |
| Pyramid |
棱锥图类型。 |
| Radar |
雷达图类型。 |
| Range |
范围图类型。 |
| RangeBar |
范围条形图类型。 |
| RangeColumn |
范围柱形图类型。 |
| Renko |
砖形图类型。 |
| Spline |
样条图类型。 |
| SplineArea |
样条面积图类型。 |
| SplineRange |
样条范围图类型。 |
| StackedArea |
堆积面积图类型。 |
| StackedArea100 |
百分比堆积面积图类型。 |
| StackedBar |
堆积条形图类型。 |
| StackedBar100 |
百分比堆积条形图类型。 |
| StackedColumn |
堆积柱形图类型。 |
| StackedColumn100 |
百分比堆积柱形图类型。 |
| StepLine |
阶梯线图类型。 |
| Stock |
股价图类型。 |
| ThreeLineBreak |
新三值图类型。 |
感谢各位的阅读！
本文转自博客园张占岭（仓储大叔）的博客，原文链接：爱上MVC~图表的使用Chart，如需转载请自行联系原博主。
