在MVC 3.0中使用MS Chart

MsChart是微软制作的功能强大的图表工具，用它可以很方便的建立各种图表。博客园里也有各种MS Chart在MVC中的用法，都不是很满意，要么要加handler，要么在视图中用，感觉各种不好。琢磨了下，也google了一些资料，最后决定用下面这种方式来实现。

示例是一个雷达图，绘图是在控制器里实现，页面调用只要直接用<img src=”{controller}”>就可以，web.config也不需要再增加任何配置。

主要步骤如下

1、引用2个类库，System.Web.DataVisualization和System.Web.DataVisualization.Design

2、控制器实现代码：

using System.Drawing;
using System.Drawing.Imaging;
using System.IO;
using System.Web.Mvc;
using System.Web.UI.DataVisualization.Charting;

namespace MvcChart.Controllers
{
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            double[] baseValues = { 65.62, 75.54, 60.45, 34.73, 85.42 };
            double[] userValues = { 80.62, 45.54, 80.45, 44.73, 80.42 };
            string[] moduleNames = { "常识判断", "言语理解表达", "判断推理", "数量关系", "资料分析" };
            Chart radar = new Chart();
            radar.Series.Add("baseSeries");
            radar.Series["baseSeries"].Points.DataBindXY(moduleNames, baseValues);
            radar.Series["baseSeries"].ChartType = SeriesChartType.Radar;
            radar.Series["baseSeries"]["RadarDrawingStyle"] = "Area";
            radar.Series["baseSeries"]["AreaDrawingStyle"] = "Polygon";
            radar.Series["baseSeries"]["CircularLabelsStyle"] = "Horizontal";
            radar.Series.Add("userSeries");
            radar.Series["userSeries"].Points.DataBindXY(moduleNames, userValues);
            radar.Series["userSeries"].ChartType = SeriesChartType.Radar;
            radar.Series["userSeries"]["RadarDrawingStyle"] = "Area";
            radar.Series["userSeries"]["AreaDrawingStyle"] = "Polygon";
            radar.Series["userSeries"]["CircularLabelsStyle"] = "Horizontal";
            radar.ChartAreas.Add("chartArea");
            radar.ChartAreas["chartArea"].Area3DStyle.Enable3D = true;
            MemoryStream stream = new MemoryStream();
            radar.SaveImage(stream, ChartImageFormat.Jpeg);
            return new ImageResult(Image.FromStream(stream), ImageFormat.Jpeg);
        }
    }
}

3、注意这里的返回类型，使用的是ImageResult，这是我们自己实现的ActionResult。

using System.Drawing;
using System.Drawing.Imaging;

namespace System.Web.Mvc
{
    public class ImageResult : ActionResult
    {
        public ImageResult()
        { }

        public ImageResult(Image image)
        {
            Image = image;
        }

        public ImageResult(Image image, ImageFormat format)
        {
            Image = image;
            ImageFormat = format;
        }

        /// <summary>
        ///
        /// </summary>
        public Image Image { get; set; }

        /// <summary>
        /// 指定图像的文件格式
        /// </summary>
        public ImageFormat ImageFormat { get; set; }

        public override void ExecuteResult(ControllerContext context)
        {
            if (Image == null)
                throw new ArgumentNullException("Image");

            if (ImageFormat == null)
                throw new ArgumentNullException("ImageFormat");

            context.HttpContext.Response.Clear();

            if (ImageFormat.Equals(ImageFormat.Gif))
                context.HttpContext.Response.ContentType = "image/gif";
            else if (ImageFormat.Equals(ImageFormat.Jpeg))
                context.HttpContext.Response.ContentType = "image/jpeg";
            else if (ImageFormat.Equals(ImageFormat.Png))
                context.HttpContext.Response.ContentType = "image/png";
            else if (ImageFormat.Equals(ImageFormat.Bmp))
                context.HttpContext.Response.ContentType = "image/bmp";
            else if (ImageFormat.Equals(ImageFormat.Tiff))
                context.HttpContext.Response.ContentType = "image/tiff";
            else if (ImageFormat.Equals(ImageFormat.Icon))
                context.HttpContext.Response.ContentType = "image/vnd.microsoft.icon";
            else if (ImageFormat.Equals(ImageFormat.Wmf))
                context.HttpContext.Response.ContentType = "image/wmf";

            Image.Save(context.HttpContext.Response.OutputStream, ImageFormat);
        }
    }
}

非常简单，不需要其它的配置。