1

I am working on Flot- dynamic data and multiple axis graph. Having issue with binding of data with Y2-axis, I am able to bind the data to the graph if it is a static graph but when I try to do the binding with dynamic data for some reason data is always binding to default y-axis only and second y-axis is not reflecting anything. Please adivse, how to resolve this problem. Here is my code below.

<div id="placeholder" style="width:600px;height:300px;"></div> 

<script type="text/javascript"> 

var xVal = 0; 

var inputdata = [[], []]; 

var options = { xaxes: [{}], 
yaxes: [{}, { show: 

true, position: "right"}] 
}


var plot = $.plot($("#placeholder"), [{ data: inputdata[0], label: "series 1" }, { data: inputdata[1], label: "series 2", yaxis: 2}], options); 


function getData() { 

// This could be an ajax call back. 

var yVal1 = Math.floor(Math.random() * 11); 

var yVal2 = Math.floor(Math.random() * 11); 

var datum1 = [xVal, yVal1]; 

var datum2 = [xVal, yVal2]; 
inputdata[0].push(datum1);

inputdata[1].push(datum2);


if (inputdata[0].length > 10) { 
inputdata[0] = inputdata[0].splice(1);

inputdata[1] = inputdata[1].splice(1);

}

xVal++;


//alert("inputdata :" + inputdata); 
plot.setData(inputdata);

plot.setupGrid();

plot.draw();


//alert("plot.getAxes() " + plot.getAx ); 
}

setInterval(getData, 1000);

</script>
4

1 回答 1

2

当您第一次调用 flot 时,您正在使用以下数据:

[{ data: inputdata[0], label: "series 1" }, 
 { data: inputdata[1], label: "series 2", yaxis: 2}
]

在您的getData函数中,您生成的数据只是数组,没有标签,也没有 yaxis 值。这将覆盖您为第二个数据数组指定的内容。相反,在您的getData函数中,重现整个系列对象:

function getData() {
   //your code here

   plot.setData(    [{ data: inputdata[0], label: "series 1" }, 
                     { data: inputdata[1], label: "series 2", yaxis: 2}
                    ] 
   );
   plot.setupGrid();
   plot.draw();
}

这里有一个工作示例:http: //jsfiddle.net/ryleyb/hqeGg/

于 2012-12-17T16:57:46.040 回答