jquery - jQPLOT - 内存泄漏

Question

我想构建一个具有交互式刷新功能的图表。我使用 jqPlot，但是通过尝试通过调用 replot() 或重绘来更新图形，会导致巨大的浏览器内存泄漏。你知道我该如何解决它吗？

function crateChart() {
    var s1 = [['a',6], ['b',8], ['c',14], ['d',20]];
    var s2 = [['a', 8], ['b', 12], ['c', 6], ['d', 9]];

    this.plot = $.jqplot('chart', [s1, s2], {
        seriesDefaults: {
        renderer:$.jqplot.DonutRenderer,
        rendererOptions:{
            sliceMargin: 3,
            startAngle: -90,
            showDataLabels: true,
            dataLabels: 'value'
            }
        }
    });
}

function update () {
    ChartTester.plot.series[0].data = [
        ['a', Math.random() * 100],
        ['b', Math.random() * 100],
        ['c', Math.random() * 100],
        ['d', Math.random() * 100]
    ];

    ChartTester.plot.destroy();
    $('#chart *').unbind();
    $('#chart').empty();
    ChartTester.plot.redraw();
}

Answer 1

我没有“即插即用”的解决方案，但 JQPlot 图表上动态数据更新的一个很好的示例可以启发您:http://jsfiddle.net/fracu/HrZcj/

基本上，更新函数是这样的:

function updateSeries() {
    myData.splice(0, 1);
    x = (new Date()).getTime();
    y = Math.floor(Math.random() * 100);
    myData.push([x, y]);

    plot1.series[0].data = myData;
    plot1.resetAxesScale();
    plot1.axes.xaxis.numberTicks = 10;
    plot1.axes.y2axis.numberTicks = 15;
    plot1.replot();
}