在Razor视图中插入图表将从生成的HTML中删除所有其他内容，断开浏览器链接仪表板的连接，禁用浏览器中的源代码视图

我已经在我的Razor视图中插入了图表。在此之前，它已正确显示在中

我插入了以下图表：

<div>
    @{
        var myChart = new Chart(width: 600, height: 400)
            .AddTitle("Chart Title")
            .AddSeries(
                name: "Employee",
                xValue: new[] { "Peter", "Andrew", "Julie", "Mary", "Dave" },
                yValues: new[] { "2", "6", "4", "5", "3" })
            .Write();
    }

    @*}*@
</div>

@{
var myChart=新图表（宽度：600，高度：400）
.AddTitle（“图表标题”）
.AddSeries(
姓名：“员工”，
xValue:new[]{“彼得”、“安德鲁”、“朱莉”、“玛丽”、“戴夫”}，
Y值：新[]{“2”、“6”、“4”、“5”、“3”}）
.Write（）；
}
@*}*@

在此之后，网站中唯一可见的内容就是这个图表，生成的视图是这样的（其他所有内容都消失了）

我无法在浏览器中打开网站的源代码（只有F12可以工作），也会使浏览器链接仪表板与浏览器失去连接

---

如何将此图表显示为Razor视图中的任何其他元素？

我的解决方案是创建一个单独的视图，在其中放置图表代码，然后调用一个控制器方法，该方法将视图作为图像源返回。例如：

查看内容（要在其中显示图表的视图）：

查看ChartMain的内容：

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

public ActionResult ChartMain()
{
    //*****Your data*****//
    ViewBag.Data = data;
    ViewBag.Names = names;
    return View();
}

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