【问题标题】:New asp.net charting controls - will they work with MVC (eventually)?新的 asp.net 图表控件 - 它们会与 MVC(最终)一起使用吗?
【发布时间】:2025-12-30 15:15:11
【问题描述】:

Scott Gu 刚刚发布了关于 .NET 团队分发的一组新图表控件的信息。他们看起来不可思议:http://weblogs.asp.net/scottgu/archive/2008/11/24/new-asp-net-charting-control-lt-asp-chart-runat-quot-server-quot-gt.aspx

百万美元的问题是......他们会与 MVC 一起工作吗?如果可以,什么时候?

【问题讨论】:

    标签: .net asp.net asp.net-mvc charts


    【解决方案1】:

    您可以通过两种方式使用图表控件:

    从控制器生成图像

    通过生成图表并将其作为操作中的图像返回(我认为 Chatuman 指的是):

    Chart chart = new Chart();
    chart.BackColor = Color.Transparent;
    chart.Width = Unit.Pixel(250);
    chart.Height = Unit.Pixel(100);
    
    Series series1 = new Series("Series1");
    series1.ChartArea = "ca1";
    series1.ChartType = SeriesChartType.Pie;
    series1.Font = new Font("Verdana", 8.25f, FontStyle.Regular);
    series1.Points.Add(new DataPoint { 
                    AxisLabel = "Value1", YValues = new double[] { value1 } });
    series1.Points.Add(new DataPoint {
                    AxisLabel = "Value2", YValues = new double[] { value2 } });
    chart.Series.Add(series1);
    
    ChartArea ca1 = new ChartArea("ca1");
    ca1.BackColor = Color.Transparent;
    chart.ChartAreas.Add(ca1);
    
    using (var ms = new MemoryStream())
    {
        chart.SaveImage(ms, ChartImageFormat.Png);
        ms.Seek(0, SeekOrigin.Begin);
    
        return File(ms.ToArray(), "image/png", "mychart.png");
    }
    

    WebForms 样式

    这样您只需将图表包含在您的 .aspx 视图中(就像使用传统的 Web 表单一样)。为此,您必须在 web.config 中连接相关位

    <controls>
        ...
        <add tagPrefix="asp"
             namespace="System.Web.UI.DataVisualization.Charting"
             assembly="System.Web.DataVisualization, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
    </controls>
    
    <httpHandlers>
        ...
        <add path="ChartImg.axd"
             verb="GET,HEAD"
             validate="false"
             type="System.Web.UI.DataVisualization.Charting.ChartHttpHandler, System.Web.DataVisualization, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" />
    </httpHandlers>
    
    <handlers>
        ...
        <add name="ChartImageHandler"
             preCondition="integratedMode" 
             verb="GET,HEAD"
             path="ChartImg.axd"
             type="System.Web.UI.DataVisualization.Charting.ChartHttpHandler, System.Web.DataVisualization, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
    </handlers>
    

    构建图表时,您无法在 DataPoint 元素中运行代码,因此要连接数据,您需要 View 类中的方法。这对我来说没问题。以这种方式工作会使控件将 URL 呈现到由图表控件 http 处理程序生成的图像。在您的部署中,您需要为其提供一个可写文件夹来缓存图像。

    * VS 2010 / .NET 4 支持 *

    要在 .NET 4 中使用此功能,您需要使用适当的公钥令牌将图表引用更改为版本 4.0.0.0。

    此外,图表控件现在似乎生成了指向当前请求路径而不是请求路由的 url。对我来说,这意味着所有图表请求都会导致 404 错误,因为 /{Controller}/ChartImg.axd 和等效项被路由阻止。为了解决这个问题,我添加了额外的 IgnoreRoute 调用来涵盖我的用法 - 更通用的解决方案会更好:

    public static void RegisterRoutes(RouteCollection routes)
    {
        routes.IgnoreRoute("ChartImg.axd/{*pathInfo}");
        routes.IgnoreRoute("{controller}/ChartImg.axd/{*pathInfo}");
        routes.IgnoreRoute("{controller}/{action}/ChartImg.axd/{*pathInfo}");
    ...
    

    【讨论】:

    • +1 - 不错。 2 个小改动:MemoryStream ms = new MemoryStream() 应该在 using 块中,并且 MVC 控制器具有用于返回文件的辅助方法 - 您可以使用 new FileStreamResult 而不是 return File(ms.ToArray(), "image/png", "mychart.png")
    • 添加了让这个在 .NET 4 中工作的信息 - 我花了很长时间才弄清楚路线的事情!
    • 我刚刚在我的博客上发布了更新的 .net 4.0 版本的图表示例,并添加了 2 个额外的项目 - ChartsWithMVC 和 ChartsWithoutWebForms,它们基本上都将图表呈现为图像并返回它。 develocity.blogspot.com/2010/04/…
    • 有没有其他方法,让我可以使用 Microsoft 图表交互和 ajax 支持?我正在使用 MVC 4
    • 可能对某人有所帮助的其他信息:如果您的图表在某个区域内,则需要添加忽略 (context.Routes.Ignore("{controller}/{action}/ChartImg.axd/{ *pathInfo}")) 到 RegisterArea 方法
    【解决方案2】:

    对于想要使用 Razor 引擎在 MVC 3 中使用图表控件的人,请参阅以下链接

    How to use MS Charts with MVC3 with Razor

    【讨论】:

      【解决方案3】:

      您已经可以将它们与 MVC 一起使用,您所要做的就是将它们渲染为图像

      【讨论】:

        【解决方案4】:

        改为创建一个 Usercontrol 并为其提供完整的 Chart 对象并让它自己呈现:

        <%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<System.Web.UI.DataVisualization.Charting.Chart>" %>
        <%
            Model.Page = this.Page;
            var writer = new HtmlTextWriter(Page.Response.Output);
            Model.RenderControl(writer);
        %>
        

        将其命名为 Chart.ascx 并将其放入您的共享视图文件夹中。

        现在您将免费获得所有额外的 html,如图像地图等。以及缓存。

        在你的控制器中:

        public ActionResult Chart(){
         var c = new Chart();
         //...
         return View(c);
        }
        

        在你的视野中:

        <% Html.RenderPartial("Chart", Model); %>
        

        【讨论】:

        • 我遇到了一些我在使用此方法之前从未见过的错误,其中第一个是Error executing child request for ChartImg.axd. - 你能帮忙吗?
        • 用户建议将&lt;add path="ChartImg.axd" verb="GET,HEAD" type="System.Web.UI.DataVisualization.Charting.ChartHttpHandler, System.Web.DataVisualization, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" validate="false" /&gt; 添加到&lt;httpHandlers&gt; 部分下的web.config 中,但这会导致另一个错误Session state has created a session id, but cannot save it because the response was already flushed by the application. - 这是否也发生在您的实现中?
        • 使用 .NET 4.0 还是 3.5?如果您使用 3.5,则必须按照*.com/questions/319835/… 的建议将这些内容添加到 web.config。
        • 如果您使用 .NET 4.0,请添加以下内容: and 以及 Simon Steele 建议的 RouteIgnore
        • 是的,谢谢卡尔!在 MVC 4 和 NET 4.5 VS2012 中为我工作。生成 web.config 元素的一种简单方法是使用解决方案资源管理器将新的 WebForm.aspx 项添加到 MVC 4 项目;然后从工具箱中将一个图表控件拖到 aspx 设计表面上。并且,在 App_Start/RouteConfig.cs 中添加代码以忽略 Simon Steele 所示的路由。
        【解决方案5】:

        这篇文章最适合我:

        http://www.codecapers.com/post/Build-a-Dashboard-With-Microsoft-Chart-Controls.aspx

        不会给出关于“对象未设置为对象实例”或“会话 id 可用但响应流已被刷新”的错误(不是错误的确切措辞)。

        我不愿意只将它们呈现为图像,因为如果您在图表上进行向下钻取或工具提示或其他点击操作,那么呈现为图像不会保留任何这些。

        我需要的关键是将图表放入模型中,将模型传递给视图(或部分视图)并在视图中放置一个 asp:panel 并将图表添加到面板在视图标记中。

        顺便说一句,这是 2010 年 9 月 3 日的 VS.net 2008 和 MVC 2(由于 MVC 不断发生变化,我在搜索答案时发现日期很重要)。

        【讨论】:

          【解决方案6】:

          我一直在使用 MVC 进行测试,目前看来它正在使用 MVC。

          【讨论】:

            最近更新 更多