[好，所以我遇到的问题是我的Google图表无法显示。我对使用ASP.NET核心应用程序还很陌生，我正在做一个学校项目。这是一个有效的示例。我正在尝试显示从数据库中获取数据的列表中的数据，但是我似乎没有使其正常工作。
此硬编码数据工作正常：
<html>
<head>
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<script type="text/javascript">
google.charts.load('current', { 'packages': ['corechart'] });
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Time', 'Data'],
['2004', 1000],
['2005', 1170],
['2006', 660],
['2007', 1030]
]);
var options = {
title: 'Temperature',
curveType: 'function',
legend: { position: 'bottom' }
};
var chart = new google.visualization.LineChart(document.getElementById('curve_chart'));
chart.draw(data, options);
}
</script>
</head>
<body class="container-fluid lead">
<div id="curve_chart" style="width: 900px; height: 500px"></div>
</body>
</html>
但是当我尝试用foreach循环替换硬编码数据时，它将不会显示。页面只是空白。这是我的带有一个foreach循环的drawChart（）。
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Time', 'Data'],
@foreach (var item in Model.measurementDataList)
{
<text>['@item.TimeStamp', @item.MeasuredValue],</text>
}
]);
我已经在表中显示了来自同一数据库的一些数据。因此，我用来填充列表的方法有效。这是我从数据库中获取数据的方法：
public List<MeasurementData> GetMeasurementData(string connectionString)
{
List<MeasurementData> measurementDataList = new List<MeasurementData>();
SqlConnection con = new SqlConnection(connectionString);
string sqlQuery = "SELECT Timestamp, MeasuredValue FROM MEASUREDATA";
SqlCommand cmd = new SqlCommand(sqlQuery, con);
con.Open();
SqlDataReader dr = cmd.ExecuteReader();
while (dr.Read())
{
MeasurementData measureParameter = new MeasurementData();
measureParameter.TimeStamp = dr["Timestamp"].ToString();
measureParameter.MeasuredValue = Convert.ToDouble(dr["MeasuredValue"]);
measurementDataList.Add(measureParameter);
}
return measurementDataList;
}
这是OnGet（）。
public void OnGet()
{
SensorConfig sensorConfig = new SensorConfig();
connectionString = _configuration.GetConnectionString("ConnectionString");
measurementDataList = sensorConfig.GetMeasurementData(connectionString);
}
出现错误：
@foreach (var item in Model.measurementDataList)
{
<text>['@item.TimeStamp', @item.MeasuredValue],</text>
}
因为如果直接在cshtml中呈现C＃，ASP.NET Core将对脚本进行HTML编码。
要运行您的应用，请考虑将脚本更改为
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Time', 'Data'],
@foreach (var item in Model.measurementDataList)
{
Html.Raw($"['{item.TimeStamp}', 'item.MeasuredValue']")
}
]);
虽然这可以解决您的问题，但是用C＃将数据呈现为HTML并不是一个好习惯。
[我强烈建议您编写一个返回数据的API，并且可以编写纯JavaScript来获取数据。
喜欢这个：
$.get('/api/mychartdata', function(data) {
google.visualization.arrayToDataTable(data);
})
并且data从ASP.NET Core Web API中呈现为JSON。
如果您不熟悉Web API，请在这里阅读文档：