Question

与This topic相关我想知道是否有人使Microsoft Charting库与Asp MVC 3和Razor一起使用。

我知道引入的新图表帮助程序，但由于这是非常有限的，这不是一个真正的选择。

要创建一个返回图像的动作方法也很容易，但由于所有交互性都会中断（即使只是条形图中条形图的简单工具提示），此方法也有一些限制。

This example可能是我发现的最有帮助的文章，但即使只在动作方法中渲染图像时，我仍然无法使用一个简单的图表。此外，我在.net 4下的样本工作正常，但显然那些不是MVC样本。

SO - 有没有人让微软的图表在Razor的Asp MVC 3中完全运行，并且可以发布一个完整解决方案的链接？

Answer 1

如果它是工具提示并向下钻取你正在寻找那么这里是一个样本。我尝试过并为我工作。您需要将ImageMap与图像链接才能具有交互性。

MVC Charts with Interactivity

Answer 2

我花了几天时间寻找一种在MVC中创建交互式图表的解决方案，但我见过的所有示例都比以前复杂得多。

Sarath的答案几乎是完美的，但它将图像保存两次，效率不高。使用函数Html.RenderAction（），我们可以在一次通过中完成所有操作，并使其尽可能高效。

以下是我提出的解决方案：

http://blog.smirne.com/2012/09/creating-interactive-charts-with-aspnet.html

我还没有看到任何可以一次完成所有事情的解决方案。最好的部分是它不需要对web.config文件进行任何修改。它也不会尝试在MVC中使用ASP.net控件。这是纯粹的MVC技术。

<强>更新

这是所要求的代码：

控制器：

public ActionResult Chart()
{
    var chart = buildChart();
    StringBuilder result = new StringBuilder();
    result.Append(getChartImage(chart));
    result.Append(chart.GetHtmlImageMap("ImageMap"));
    return Content(result.ToString());
}

效用函数：

private Chart buildChart()
{
    // Build Chart
    var chart = new Chart();

    // Create chart here
    chart.Titles.Add(CreateTitle());
    chart.Legends.Add(CreateLegend());
    chart.ChartAreas.Add(CreateChartArea());
    chart.Series.Add(CreateSeries());

    return chart;
}

private string getChartImage(Chart chart)
{
    using (var stream = new MemoryStream())
    {
       string img = "<img src='data:image/png;base64,{0}' alt='' usemap='#ImageMap'>";
       chart.SaveImage(stream, ChartImageFormat.Png);
       string encoded = Convert.ToBase64String(stream.ToArray());
       return String.Format(img, encoded);
    }
}

查看：

@{ Html.RenderAction("Chart"); }

Answer 3

这将是使用ASP.NET MVC 2和Microsoft Charting Controls的CodeProject的完整解决方案：

ASP.NET MVC Chart Control

这可能和目前的情况一样好（至少我找不到更适合你需求的东西），因为ASP.NET MVC 3仍然只是RTM，剃刀视图引擎也是如此。无论如何，将它从ASP.NET MVC 2迁移到3并不是什么大问题。将视图引擎切换到剃须刀需要多一点努力，但整体概念保持不变。

我会说“为它而去”，当你遇到具体问题或有疑问时，请在此处提出。

<强>更新

Robert Muehsig的这篇博文也涵盖了这个主题，并且有一个可下载的解决方案。根据您的评论，它看起来更像您实际想要完成的事情：

HowTo: Use the new ASP.NET Chart Controls with ASP.NET MVC

Microsoft Charting，MVC 3和Razor

3 个答案: