通过从数据库获取数据绘制实时flot图表，并使用JavaScript将其存储到数组中_Javascript_Jquery_Html_Oracle10g_Flot

通过从数据库获取数据绘制实时flot图表，并使用JavaScript将其存储到数组中

javascript jquery html oracle10g

通过从数据库获取数据绘制实时flot图表，并使用JavaScript将其存储到数组中,javascript,jquery,html,oracle10g,flot,Javascript,Jquery,Html,Oracle10g,Flot,我试图通过从oracle数据库检索数据并将其存储到数组中来绘制实时更新flot图表 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1

我试图通过从oracle数据库检索数据并将其存储到数组中来绘制实时更新flot图表

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script type="text/javascript" src="jquery-1.11.3.min.js"></script>
<script type="text/javascript" src="js plugins/excanvas.js"></script>
<script type="text/javascript" src="js plugins/jquery.flot.js"></script>
<script type="text/javascript" src="js plugins/jquery.flot.time.min.js"></script>
<script type="text/javascript" src="js plugins/jquery.flot.axislabels.js"></script>

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

        var rs=new ActiveXObject('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:"%m/%d %H:%M",                               ,
            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>
    <div id="container" style="width:1360px; height:1200px"></div>
</body>
</html>

我得到的错误是对象不再有效

我的日期是2015年2月25日00:14、2015年2月25日00:33、2015年2月25日00:53，但显示如下

我想要x轴如下-

如何修复此问题并获得所需的x轴？

请帮助

1您的绘图调用$。绘图$容器、数据集、选项在数据集周围缺少括号，末尾缺少一个semikolon。2在调用plot之前，请尝试console.logdataset并查看数组的外观。3在错误消息中给出的行上查看jquery.flot.js文件。如果您需要更多帮助，请使用您的发现更新您的问题。并使用minTickSize:[1，hour]代替tickSize:[2，second]作为x轴。@Raidri感谢您的回答。x轴问题已解决。@Raidri i在jquery.flot.js文件中检查，如果f{if f.number&&val！=null{val=+val；if isNaNval=null；否则如果val==Infinity val=fakeInfinity；否则如果val==Infinity val=-fakeInfinity；}，错误显示在val=+val；//转换为数字。@Raidri如果我尝试打印document.writedata[i++]；我将获取数组，格式为Wed Apr 01 09:27:00 UTC+0530 2015,20.1 Wed Apr 01 18:52:00 UTC+0530 2015,18.2