如何在实时Flot图表中显示Json随机数？

我在C＃页面中创建了一个存储在json对象中的随机数：

if (method == "rnd") { //Random number this.Page.Response.ContentType = "application/json2"; Random rnd = new Random(); int nr = rnd.Next(1, 100); // creates a number between 1 and 99 String str1 = nr.ToString(); var json2 = new JavaScriptSerializer().Serialize(str1); this.Page.Response.Write(json2); } 

然后我在我的ASP页面上显示它：

  function test2() { $.ajax({ type: 'GET', url: ('ajax.aspx?meth=') + "rnd",/ contentType: 'application/json2; charset=utf-8', dataType: 'json', async: true, cache: false, global: false, timeout: 120000, success: function (data, textStatus, jqXHR) { $('#nr').html(data); //start: plot in real time var plot = $.plot("#placeholder", data, { series: { shadowSize: 0 // Drawing is faster without shadows }, yaxis: { min: 0, max: 100 }, xaxis: { show: false } }); //end: plot in real time }, error: function (jqXHR, textStatus, errorThrown) { window.alert(errorThrown); } }); } window.setInterval(test2, 1000); 

和HTML：

我的图表上没有随机数字。 我做错了什么？ //start: plot in real time和//end: plot in real time之间的代码//start: plot in real time我从这里//end: plot in real time ： http ： //www.flotcharts.org/flot/examples/realtime/index.html

Answer 1

在客户端试试这个：

 function test2() { $.ajax({ type: 'GET', url: ('ajax.aspx?meth=') + "rnd", contentType: 'application/json2; charset=utf-8', dataType: 'json', //async: true, //cache: false, //global: false, // timeout: 120000, success: function (data, textStatus, jqXHR) { var obj = jQuery.parseJSON(data); $('#azi').html(obj.sec); $('#nr').html(obj.val); $('#nr1').html(obj.val1); t = obj.val; t1 = obj.val1; }, error: function (jqXHR, textStatus, errorThrown) { window.alert(errorThrown); } }); } 

Answer 2

Flot需要将其数据作为数据序列和数据点的数组而不仅仅是一个数字。 最简单的解决方案是在$.plot()调用之前插入它：

 data = [[[1, data]]]; 

如果你想像在示例中一样构建一个图表，你必须从（空）数组开始并添加你得到的每个新数字。

编辑：

对于完整的行，定义图表数据的全局变量和计数器：

 var completeData = [[]]; var dataCounter = 0; 

在您的success回调中，而不是上面的代码插入此：

 completeData[0].push([dataCounter++, data]); 

并将$.plot()调用更改为

 var plot = $.plot("#placeholder", completeData, {