ASP.NET MVC 3 Beta: Built-in support for charts(MVC3 Razor中使用图表的最佳方案)
发布日期:2021-07-13 12:12:13 浏览次数:4 分类:技术文章

本文共 1815 字,大约阅读时间需要 6 分钟。

选择了很久,终于找到代码最简单的解决方案:其实就是MS自带的chart。MS Chart存在已久,只是在以前的用法中,需要保存img,这将导致MVC的访问冲突(曾困扰过我们一个项目),大致就是:

 

以下可用:.net3.5 + mvc + MS Chart 

以下不可用:.net4.0 + mvc + MS Chart(神奇的是,MS Chart从.net4.0开始才是自带的,看来是发布前忘了测试mvc了)

 

终于找到一个帖子是关于这种用法的一个变种,在.net4.0 + mvc3 + MS Chart环境中测试有效。

原帖在此

不过原帖是英文的,下面是大致的中文过程。笔者把例子推进一下,可以传入一个title导致报表的变化。当然实际使用的时候就不是只传title,而是会是例如reports/anualsales?year=2011之类。

 


步骤1:在View中要放图表的位置写上

<p><img src="/Home/Chart?title=abc" /></p>


步骤2:在controller中实现action,这里就是实现HomeController/Chart(string title)

 

using System.Web.Helpers; //Chart/ChartTheme在这里定义。

        public ActionResult Chart(string title)

        {
            var model = new ChartModel();
            var data = model.GetChartData();
            new Chart(400, 200, ChartTheme.Blue)
                .AddTitle(title)
                .DataBindTable(data, "X")
                .Write("png");
            return null;
        }
神奇之处是不需要为这个Action编写View,而且还return null。这个本人也不懂为什么,不过能用就够了:)


步骤3:把唯一的悬念ChartModel类及其方法GetChartData()实现了:

 

using System.Collections; //IList/ArrayList在这里定义的

    public class ChartModel
    {
        public IList GetChartData()
        {
            return new ArrayList
            {
                new { X = DateTime.Now.AddMonths(-2), Y = 200 },
                new { X = DateTime.Now.AddMonths(-1), Y = 300 },
                new { X = DateTime.Now, Y = 500 }
            };
        }
    }

 


当然这里的ChartModel是个测试类,如果回到刚才的Sales场景,这个类不需要存在,同时把步骤2变成:

 

using MyApp.Models; //Sales在这里定义的,是自己代码中原来就有的。

 

public ActionResult anualsales(int year)

{
    new Chart(400, 200, ChartTheme.Blue)

        .AddTitle(title)

        .DataBindTable(Sales.Data(), "X")
        .Write("png");
    return null;
}

另需在Sales中实现public IList Data()就可以了(正常情况这是一个已经存在的接口)。

全部过程比把大象关进冰箱还少一步。

 

不过,这个helper有很多限制,比如现在只有AddTitle / AddSerise / AddLegend这几个函数,不能增加Marker / 调整每条线的颜色粗细 / 不能……总之比非MVC的Chart(System.Web.UI.DataVisualization.Charting.Chart )差很多,不过用起来很方便。期待MVC4里边能增加几个新的函数了。

 

关于如何使用MS Chart,请参考:

ChartTheme其实就是这个链接中提到的那些aspx代码(到ChartTheme定义中可以看到代码本身),只要重载就能做自己的Theme,实现一些简单功能(如移动legend的位置等)。

 

.net 3.5例程:

.net 4.0例程:

 

点击下载免费的敏捷开发教材:《》

 

转载地址:https://blog.csdn.net/cheny_com/article/details/6381667 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!

上一篇:CMMI与Agile敏捷开发比较之一:两者的本质区别
下一篇:《快速软件开发——有效控制与完成进度计划》

发表评论

最新留言

逛到本站,mark一下
[***.202.152.39]2024年04月20日 03时15分11秒

关于作者

    喝酒易醉,品茶养心,人生如梦,品茶悟道,何以解忧?唯有杜康!
-- 愿君每日到此一游!

推荐文章