微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

Flot JS 带有与数据链接的实时时间戳提要

如何解决Flot JS 带有与数据链接的实时时间戳提要

所以我正在研究这个 Flot JS,我需要 X 轴来滚动实时时间戳并从数据库获取相应的数据以进行绘图。

我不确定我哪里出错了,因为我什至无法在 XAxis 中获取时间戳。

function initRealTimeChart() 
{
    var plot_1 = $.plot('#real_time_chart_1',[getRandomData_1()],{
        series: {
            shadowSize: 0,color: 'rgb(0,212,14)'
        },grid: {
            borderColor: '#f3f3f3',borderWidth: 1,tickColor: '#f3f3f3',hoverable: true,clickable: true
        },lines: {
            fill: false,},yaxis: {
            min: 0,max: 100
        },xaxis: {
            mode: "time",timeformat: "%H/%M%s",tickSize: [5,"second"]
        }                    
    });
    function updateRealTime() 
    {
        plot_1.setData([getRandomData_1()]);
        plot_1.draw();
        var timeout;
        if (realtime === 'on') {
            timeout = setTimeout(updateRealTime,500);
        } else {
            clearTimeout(timeout);
        }
    }
    
    updateRealTime();
}

var data_1 = [0.000,0.000,0.000],totalPoints_1 = 110;
function getRandomData_1() 
{
    if (data_1.length > 0) 
    {
        data_1 = data_1.slice(1);
    }
    while (data_1.length < totalPoints_1) 
    {
        var y;
        $.ajax({
            url:'getPlotData.PHP',method:'POST',async: false,data:{
                deviceid:devID,sensorID:"htu-temperature"
            },success:function(data)
            {
                y = data;
            }
        });
        data_1.push(y);
    }
    var res_1 = [];
    for (var i = 0; i < data_1.length; ++i) 
    {
        res_1.push([i,data_1[i]]);
    }
    return res_1;
}

只要我将 xaxis 设为 min:0 和 max:100,事情就可以正常工作,但不确定为什么当我将模式更改为 Time 时它们会失败。轴上也没有显示时间。

任何帮助都会很棒。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。