返回Json时带有flot.js图表的Asp.net Web表单不起作用
我将ASP.NET webforms用于flot图表,我使用[Webmethod]将其连接到test.aspx.cs文件中的数据库,在那里我可以返回json 我将返回值存储在textarea和$.plotplaceholder[以及此处]选项中。它不会在placeholder中打印图形,但当我这样做时:返回Json时带有flot.js图表的Asp.net Web表单不起作用,asp.net,json,charts,webforms,flot,Asp.net,Json,Charts,Webforms,Flot,我将ASP.NET webforms用于flot图表,我使用[Webmethod]将其连接到test.aspx.cs文件中的数据库,在那里我可以返回json 我将返回值存储在textarea和$.plotplaceholder[以及此处]选项中。它不会在placeholder中打印图形,但当我这样做时: var data = past textarea的值,然后运行应用程序,它会将该值打印给我 [WebMethod] [ScriptMethod(ResponseFormat =
var data = past
textarea的值,然后运行应用程序,它会将该值打印给我
[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public static List<string> GetLocation(string location)
{
List<string> result = new List<string>();
StringBuilder strQuery = new StringBuilder();
strQuery.Append("SELECT Location.Nome_Location, DATEPART(day, Statistiche.Data_Statistica) AS SDay, COUNT(Statistiche.ID_Tabella) AS Stats");
strQuery.Append(" FROM Statistiche INNER JOIN Tabelle ON Statistiche.ID_Tabella = Tabelle.ID_Tabella INNER JOIN");
strQuery.Append(" Location ON Statistiche.ID_Colonna_Statistica = Location.ID_Location");
strQuery.Append(" WHERE (Statistiche.ID_Tabella = 2) AND (Statistiche.ID_Box = 60) AND (Location.Nome_Location = 'Albilò')");
strQuery.Append("GROUP BY Location.Nome_Location, DATEPART(day, Statistiche.Data_Statistica)");
string query = strQuery.ToString();
SqlConnection con = new SqlConnection("");
SqlCommand cmd = new SqlCommand(query, con);
con.Open();
int counter = 1;
SqlDataReader dr = cmd.ExecuteReader();
while (dr.Read())
{
if (counter == 1)
{
result.Add("[{'label': 'Europe (EU27)','data':[[" + dr["SDay"].ToString() + "," + dr["Stats"].ToString() + "]");
}
else
result.Add("[" + dr["SDay"].ToString() + "," + dr["Stats"].ToString() + "]");
if (counter==31)
{
result.Add("[" + dr["SDay"].ToString() + "," + dr["Stats"].ToString() + "]]}]");
}
counter++;
}
return result;
}
首先,为什么要自己创建JSON?您已经指定在属性中返回JSON。 重构方法返回POCO对象的简单数组,如
[Serializable]
public class pocoObject
{
public string Label;
..
}
然后,您的方法应该只返回对象列表并设置属性:
[WebMethod]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
public static List<pocoObject> GetLocation(string location)
{
...
return result; // result is list of pocoObjects
}
js对您设置为源的数据相当敏感,所以在查看firebug中的数据之后,应该是正确的json格式的数据。因此,请访问并将您的数据与工作数据进行比较
以下是初始化绘图图例名称的方法:
$(function () {
var d1 = [];
for (var i = 0; i < Math.PI * 2; i += 0.25)
d1.push([i, Math.sin(i)]);
var d2 = [];
for (var i = 0; i < Math.PI * 2; i += 0.25)
d2.push([i, Math.cos(i)]);
var d3 = [];
for (var i = 0; i < Math.PI * 2; i += 0.1)
d3.push([i, Math.tan(i)]);
$.plot($("#placeholder"), [
{ label: "sin(x)", data: d1},
{ label: "cos(x)", data: d2},
{ label: "tan(x)", data: d3}
], {
series: {
lines: { show: true },
points: { show: true }
},
xaxis: {
ticks: [0, [Math.PI/2, "\u03c0/2"], [Math.PI, "\u03c0"], [Math.PI * 3/2, "3\u03c0/2"], [Math.PI * 2, "2\u03c0"]]
},
yaxis: {
ticks: 10,
min: -2,
max: 2
},
grid: {
backgroundColor: { colors: ["#fff", "#eee"] }
}
});
});
你为什么要用[serializable]属性创建JSON内容你自己的用户POCO。对不起,我真的很新。有没有同样的例子可以解决我的问题,谢谢。请给我一步一步的解决方案,谢谢。我想要这种格式,所以我如何创建它:[{‘标签’:‘欧洲EU27’,‘数据’:[[1,97],[2,114],[3,116]…],现在我使用asmx文件尝试了同样的方法,我已经完成了示例。我很困惑,你能给我一些非常初级的提示吗,我真的不知道你想要创建什么样的flot?我想要这种格式,那么我如何创建它:[{‘标签’:‘欧洲EU27’,‘数据’:[[1,97],[2,114],[3,116]}],我删除了我自己创建的json,它给了我:[1,97,2114,3116,4],所以你想添加一个图例来绘制名为Europe EU27的图?
$(function () {
var d1 = [];
for (var i = 0; i < Math.PI * 2; i += 0.25)
d1.push([i, Math.sin(i)]);
var d2 = [];
for (var i = 0; i < Math.PI * 2; i += 0.25)
d2.push([i, Math.cos(i)]);
var d3 = [];
for (var i = 0; i < Math.PI * 2; i += 0.1)
d3.push([i, Math.tan(i)]);
$.plot($("#placeholder"), [
{ label: "sin(x)", data: d1},
{ label: "cos(x)", data: d2},
{ label: "tan(x)", data: d3}
], {
series: {
lines: { show: true },
points: { show: true }
},
xaxis: {
ticks: [0, [Math.PI/2, "\u03c0/2"], [Math.PI, "\u03c0"], [Math.PI * 3/2, "3\u03c0/2"], [Math.PI * 2, "2\u03c0"]]
},
yaxis: {
ticks: 10,
min: -2,
max: 2
},
grid: {
backgroundColor: { colors: ["#fff", "#eee"] }
}
});
});