图表在一个系统中是必须的,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>对象存在多个元素即可,也就是说,它里面的元素除了一个"X-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,如需转载请自行联系原博主。