duangengruan2144 2015-11-20 18:32
浏览 53

FlotCharts / PHP / MySQL - 多轴和实时疯狂

I'm trying to do a realtime Bar Chart. On left (Y axis) i have clients Name and on bottom (X axis) i have a number (a count from mysql).

Simply i cant understand why wont go the redraw. I've been trying solving the problem alone and searching on google and here last 2 days without any success. Here is the code:

`

<script>
    var rawData = [<?php echo getDataLog(); ?>];
    var dataSet = [{ label: "Numero di Allarmi", data: rawData, color: "#E8E800" }];
    var ticks = [<?php echo getDataLogName(); ?>];

    var options = {
        series: {
            bars: {
                show: true
            }
        },
        bars: {
            align: "center",
            barWidth: 0.5,
            horizontal: true,
            fillColor: { colors: [{ opacity: 0.5 }, { opacity: 1}] },
            lineWidth: 1
        },
        xaxis: {
            axisLabel: "Allarmi",
            axisLabelUseCanvas: true,
            axisLabelFontSizePixels: 12,
            axisLabelFontFamily: 'Verdana, Arial',
            axisLabelPadding: 10,
            max: 2000,
            tickColor: "#5E5E5E",
            color: "black"
        },
        yaxis: {
            axisLabel: "Clienti",
            axisLabelUseCanvas: true,
            axisLabelFontSizePixels: 12,
            axisLabelFontFamily: 'Verdana, Arial',
            axisLabelPadding: 3,
            tickColor: "#5E5E5E",
            ticks: ticks,
            color: "black"
        },
        legend: {
            noColumns: 0,
            labelBoxBorderColor: "#858585",
            position: "ne"
        },
        grid: {
            hoverable: true,
            borderWidth: 2,
            backgroundColor: { colors: ["#171717", "#4F4F4F"] }
        }
    };

    function updateGraph(){
        var rawData = [<?php echo getDataLog(); ?>];
        var dataSet = [{ label: "Numero di Allarmi", data: rawData, color: "#E8E800" }];
        var ticks = [<?php echo getDataLogName(); ?>];
        $.plot($("#flot-placeholder"), dataSet, options);
        $("#flot-placeholder").UseTooltip();

    }

    var previousPoint = null, previousLabel = null;

    $.fn.UseTooltip = function () {
        $(this).bind("plothover", function (event, pos, item) {
            if (item) {
                if ((previousLabel != item.series.label) ||
             (previousPoint != item.dataIndex)) {
                    previousPoint = item.dataIndex;
                    previousLabel = item.series.label;
                    $("#tooltip").remove();

                    var x = item.datapoint[0];
                    var y = item.datapoint[1];

                    var color = item.series.color;
                    //alert(color)
                    //console.log(item.series.xaxis.ticks[x].label);                

                    showTooltip(item.pageX,
                    item.pageY,
                    color,
                    "<strong>" + item.series.label + "</strong><br>" + item.series.yaxis.ticks[y].label +
                    " : <strong>" +x+ "</strong> Allarmi");
                }
            } else {
                $("#tooltip").remove();
                previousPoint = null;
            }
        });
    };

    function showTooltip(x, y, color, contents) {
        $('<div id="tooltip">' + contents + '</div>').css({
            position: 'absolute',
            display: 'none',
            top: y - 10,
            left: x + 10,
            border: '2px solid ' + color,
            padding: '3px',
            'font-size': '9px',
            'border-radius': '5px',
            'background-color': '#fff',
            'font-family': 'Verdana, Arial, Helvetica, Tahoma, sans-serif',
            opacity: 0.9
        }).appendTo("body").fadeIn(200);
    }

    setInterval(function(){
        updateGraph();
        console.log("a");
    },1000)

</script>`

I really give up on try to understand why wont refresh the graph

  • 写回答

0条回答 默认 最新

    报告相同问题?

    悬赏问题

    • ¥15 执行 virtuoso 命令后,界面没有,cadence 启动不起来
    • ¥50 comfyui下连接animatediff节点生成视频质量非常差的原因
    • ¥20 有关区间dp的问题求解
    • ¥15 多电路系统共用电源的串扰问题
    • ¥15 slam rangenet++配置
    • ¥15 有没有研究水声通信方面的帮我改俩matlab代码
    • ¥15 ubuntu子系统密码忘记
    • ¥15 保护模式-系统加载-段寄存器
    • ¥15 电脑桌面设定一个区域禁止鼠标操作
    • ¥15 求NPF226060磁芯的详细资料