Flot plothover不在右下角工作

时间:2015-05-07 16:07:42

标签: javascript jquery flot

显示我的图表工作正常,但鼠标悬停在图表上仅在图表的top 30%和left 10%方面,我做错了什么?

这个代码是由多个按钮和更新引发的,我是以错误的方式更新它吗?



function loadGraph(myArr, percent) {

    var graphData = [{
        color: '#00FF00',
        data: []
    }, {
        color: '#FF0000',
        data: []
    }, {
        color: '#FFFF00',
        data: []
    }];

    var avgPrices = [];

    for (var i = 0; i < 10; i++) {
        var date = new Date(myArr.items[myArr.items.length - (i + 1)].date).getTime();
        if (lines.min == true) {
            graphData[0].data[i] = [date, myArr.items[myArr.items.length - (i + 1)].lowPrice]
        };
        if (lines.max == true) {
            graphData[1].data[i] = [date, myArr.items[myArr.items.length - (i + 1)].highPrice]
        };
        if (lines.avg == true || percent) {
            graphData[2].data[i] = [date, myArr.items[myArr.items.length - (i + 1)].avgPrice]
        };
        avgPrices.push(myArr.items[myArr.items.length - (i + 1)].avgPrice);
    }

    var plotBox = $('#graph-lines');

    var plot = $.plot(plotBox, graphData, {
        series: {
            points: {
                show: true,
                radius: 5
            },
            lines: {
                show: true
            },
            shadowSize: 0
        },
        grid: {
            color: '#00cece',
            borderColor: 'transparent',
            borderWidth: 0,
            hoverable: true
        },
        xaxis: {
            mode: "time"
        },
        yaxis: {
            tickFormatter: function(val, axis) {
                if (percent) {
                    return (val * 100).toFixed(1) + '%'
                } else {
                    return val.toFixed(2)
                }
            },
        }
    });

    var previousPoint = null;
    plotBox.bind('plothover', function(event, pos, item) {
        console.log('hovering!');
        if (item) {
            if (previousPoint !== item.dataIndex) {
                previousPoint = item.dataIndex;
                $('#tooltip').remove();
                var monthNames = ["January", "February", "March", "April", "May", "June",
                    "July", "August", "September", "October", "November", "December"
                ];

                var date = new Date(item.datapoint[0]);
                var x = monthNames[date.getMonth()] + " " + date.getDate() + " - " + date.getFullYear(),
                    y = item.datapoint[1];
                showTooltip(item.pageX, item.pageY, y + ' Interstellar Kredit (ISK) at ' + x);
            }
        } else {
            $('#tooltip').remove();
            previousPoint = null;
        }
    });

};
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

在获得显示工具提示的代码之前,您是否检查过调试器以查看是否出现错误?我不知道浏览器是如何通过for循环的;它看起来像你应该得到索引超出界限错误。

尝试以下列方式为所有三个if语句更改if语句。

if (lines.avg == true || percent) {
            graphData[2].data.push([date, myArr.items[myArr.items.length - (i + 1)].avgPrice]);
        }

在上面的代码中,我已经在then块中移动了分号。另外,我正在将这一点推到数组而不是访问indice(在你试图访问它的时候,数组看起来是空的)。