问题描述
以下是我的看法。 我已经对其进行了修改,以显示我希望它如何工作。 我有一个页面加载时绘制的图形。 我的模型包含它需要的数据。 我必须将其转换为JSON(对吗?),然后将其传递给generateGraph,但是setOnLoadCallBack是我的问题。 在调用setOnLoadCallBack之前,我不知道如何创建JSON字符串。
@model IEnumerable<FHWebUserInterface.Models.Weight>
<div id="visualization" style="width: 600px; height: 400px;"></div>
<div id="linechart_material"></div>
@{
var serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
var weightsAsJsonString = serializer.Serialize(Enumerable.Select(Model, weight =>
new
{
date = weight.Date,
value = weight.Value
}));
}
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load('visualization', '1.1', { packages: ['corechart', 'imagelinechart'] });
</script>
<script type="text/javascript">
function drawVisualization(weightsAsJsonString) {
// Removed the body
chart.draw(data, options);
}
google.setOnLoadCallback(drawVisualization(weightsAsJsonString));
</script>
1楼
您只需要在JSON这样的JavaScript块中的某个位置呈现json(我已经在google.setOnLoadCallback
调用之前添加了它):
@model IEnumerable<FHWebUserInterface.Models.Weight>
<div id="visualization" style="width: 600px; height: 400px;"></div>
<div id="linechart_material"></div>
@{
var serializer = new System.Web.Script.Serialization.JavaScriptSerializer();
var weightsAsJsonString = serializer.Serialize(Enumerable.Select(Model, weight =>
new
{
date = weight.Date,
value = weight.Value
}));
}
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load('visualization', '1.1', { packages: ['corechart', 'imagelinechart'] });
</script>
<script type="text/javascript">
function drawVisualization(weightsAsJsonString) {
// Removed the body
chart.draw(data, options);
}
// here is my change
var weightsAsJsonString = @weightsAsJsonString; // so it will render your C# object from server side here on client side
google.setOnLoadCallback(drawVisualization(weightsAsJsonString));
</script>