Draw a real-time flot chart by fetching data from database and store it into an array using JavaScri


Joined
Sep 3, 2015
Messages
1
Reaction score
0
I'm trying to draw a real-time update flot chart by retrieving data from oracle database and store it into an array and display the chart. Here is my code==>

<html><head><metahttp-equiv="Content-Type"content="text/html; charset=iso-8859-1"><title>Untitled Document</title><scripttype="text/javascript"src="jquery-1.11.3.min.js"></script><scripttype="text/javascript"src="js plugins/excanvas.js"></script><scripttype="text/javascript"src="js plugins/jquery.flot.js"></script><scripttype="text/javascript"src="js plugins/jquery.flot.time.min.js"></script><scripttype="text/javascript"src="js plugins/jquery.flot.axislabels.js"></script>

<scripttype="text/javascript">var data=[];var dataset;var updateInterval =1000;function getdata(){var con=newActiveXObject('ADODB.Connection');var connectionString="Provider= OraOLEDB.Oracle;User id=SYSTEM;Password=xxxx;datasource=ORA";
con.Open(connectionString);

var rs=newActiveXObject('ADODB.Recordset');
rs.Open("select W_DATE,DATA from cet", con);var i=0;while(!rs.eof){
data.push([rs(0)*1000,rs(1)]);
data[i++];
rs.movenext;}

rs.close;
con.close;}

var options={
series:{
lines:{
show:true,
lineWidth:1.2,
fill:true
}
},
xaxis:{
mode:"time",
tickSize:[2,"second"],
timeformat:"%0m/%0d %0H:%0M",,
axisLabel:"Time",
axisLabelUseCanvas:true,
axisLabelFontSizePixels:12,
axisLabelFontFamily:'Verdana, Arial',
axisLabelPadding:10
},
yaxis:{
min:0,
max:100,
tickSize:5,
tickFormatter:function(v, axis){
if(v %10==0){
return v;
}else{
return"";
}
},
axisLabel:"Data loading",
axisLabelUseCanvas:true,
axisLabelFontSizePixels:12,
axisLabelFontFamily:'Verdana, Arial',
axisLabelPadding:6
},
legend:{
labelBoxBorderColor:"#fff"
},
grid:{
backgroundColor:{
colors:["#B0D5FF","#5CA8FF"]}}};

$(document).ready(function(){
getdata();

dataset =[
{ label:"Data", data: data }
];

$.plot($("#container"), dataset, options);

function update(){
data.shift();
getdata();

$.plot($("#container"), dataset, options)
setTimeout(update, updateInterval);
}

update();});</script></head>

<body><divid="container"style="width:1360px;height:1200px"></div></body></html>

But i'm getting an error that is Object is no longer valid

here is my data in the database=

w_date data

1/4/2015 9:27 20.1

1/4/2015 18:52 18.2

2/4/2015 19:00 18.3

2/4/2015 21:25 15.1

how can i fix this error? Please help..
 

Attachments

  • getting error.JPG
    getting error.JPG
    48.7 KB · Views: 513
Ad

Advertisements


Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top