ASP.NET MVC：显示模型中的多个图表

RGH 发表于 Dev

生长激素

我想要一个包含多个图表的网页。图表的数据位于我的模型中，该模型是我在控制器中创建的并传递给视图的。但是，在视图中创建图表时遇到了麻烦。

Microsoft已创建此类以在MVC中创建基本图表：https : //msdn.microsoft.com/zh-cn/library/system.web.helpers.chart%28v=vs.111%29.aspx

它有古怪的地方。例如，如果要显示多个图表，则需要从视图中调用回控制器。（在“在网页内显示图表”部分对此进行了说明：http : //www.asp.net/web-pages/overview/data/7-displaying-data-in-a-chart）

基本上，您需要使用@ Url.Action（“ MakeChart”）作为HTML图像标签的src。但是，如何将视图内的模型传递回控制器以创建图像？如果我尝试通过@ Url.Action传递模型，则该模型为空引用。

判断面包

哇，我试图按照他们的指示去做，也很沮丧。

最后，我必须这样做。

控制器

public ActionResult MakeChart()
{
    return this.View(new Employees());
}

public ActionResult ShowChart()
{
    return this.View(new Employees());
}

ShowChart.cshtml

@model MyDashboard.Models.Employees
@{
    Layout = null;
}

<!DOCTYPE html>
<html>
<head>
    <title>Chart Example</title>
</head>
<body>
    <h1>Chart Example</h1>
    <p>
        The following chart is generated by the <em>ChartArrayBasic.cshtml</em> file, but is shown
        in this page.
    </p>
    @*<p><img src="MakeChart.cshtml" /> </p>*@
    <img src="@Url.Action("MakeChart", new {  model = @Model })" />
</body>
</html>

MakeChart.cshtml

@model MyDashboard.Models.Employees

@{
    var myChart = new Chart(width: 600, height: 400)
        .AddTitle("Chart Title")
        .AddSeries(
            name: "Employee",
            xValue: @Model.Names,
            yValues: @Model.Ids)
        .Write();
}

型号=员工

public class Employees
{
    public string[] Names { get; set; }

    public string[] Ids { get; set; }

    public Employees()
    {
        this.Names = new[] { "Peter", "Andrew", "Julie", "Mary", "Dave" };
        this.Ids = new[] { "2", "6", "4", "5", "3" };
    }
}

结果

在此处输入图片说明