图像的MVC URL下载图像而不是显示视图

本文关键字:图像 显示 视图 下载 MVC URL | 更新日期: 2023-09-27 18:01:06

MVC新手。我试图使用MVC在浏览器中显示图形,但当我运行应用程序时,页面会下载图像并关闭。

我的控制器

 public ActionResult DrawChart()
    {
        var chart = new Chart(width: 300, height: 200)
            .AddSeries(
                        chartType: "bar",
                        xValue: new[] { "10 Records", "20 Records", "30 Records", "40 Records" },
                        yValues: new[] { "50", "60", "78", "80" })
                        .GetBytes("png");
        return File(chart, "image/bytes");
    }

我的视图

    @{
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>DrawChart</title>
</head>
<body>
    <div> 
        <img src="@Url.Action("DrawChart")" alt="Drawing chart with HTML Helper" />
    </div>
</body>
</html>

图像的MVC URL下载图像而不是显示视图

您正在返回一个mime类型为image/bytes的文件结果,并且您还正在调用GetBytes("png")方法(我假设它正在获取PNG字节(。

在这种情况下,您可以尝试return File(chart, "image/png");,这将指示浏览器显示图像。

您可以使用Razor直接将其写入视图,如下所示,也可以使用Partial视图并在需要的地方渲染它

    <div>
@{
    var chart = new Chart(width: 300, height: 200)
                .AddSeries(
                            chartType: "bar",
                            xValue: new[] { "10 Records", "20 Records", "30 Records", "40 Records" },
                            yValues: new[] { "50", "60", "78", "80" })
                            .Write();
    }
</div>

请参阅此链接:http://www.asp.net/web-pages/overview/data/7-displaying-data-in-a-chart