Question

我在初次加载页面时收到一组数据，并将其显示在flot图表中。我有一个下拉菜单，允许用户选择“年初至今”或“月到日”，一切正常，除了图表不重绘图表，所以当您将选择更改为“月到日期“，它仍然列出x轴上的所有日历月，而不是每月的日期。我已尝试使用$.plot.setupGrid()和$.plot.draw()，chartTaggedSpending.setupGrid()和chartTaggedSpending.draw()，但它无效，所以我在这里做错了。提前感谢您提供的任何帮助。

以下是ajax.done()功能块中调用的代码：

if(selectView = 1 && response.length != 0) {

        var chartTaggedSpending = $('#tagged-spending');
        var arrMonthLabels = [[1, 'Jan'], [2, 'Feb'], [3, 'Mar'],[4, 'Apr'],
[5, 'May'],[6, 'Jun'], [7, 'Jul'], [8, 'Aug'], [9, 'Sep'], [10, 'Oct'],
[11, 'Nov'], [12, 'Dec']];
        $.plot(chartTaggedSpending,
            [
                {
                    data: response[1].data,
                    label: 'Budgeted: ' + response[1].label,
                    lines: { show: true},
                    points: { show: true, radius: 7 }
                },
                {
                    data: response[0].data,
                    label: 'Spent: ' + response[0].label,
                    lines: { show: true}, 
                    points: { show: true, radius: 7 }
                }
            ],
            {
                colors: ['#a6db34', '#33a6db'],   
                legend: { show: true },
                grid: { borderWidth: 0, hoverable: true, clickable: true },
                yaxis: {min: 0, max: 2000, ticks: 10, tickColor: '#eeeeee' },
                xaxis: { 
                    min: 1,
                    max: 12,
                    ticks: arrMonthLabels,
                    tickColor: '#ffffff' 
                }
            }
        );
    }
    if(selectView = 0 && response.length != 0) {
        var chartTaggedSpending = $('#tagged-spending');
        $.plot(chartTaggedSpending,
            [
                {
                    data: response[1].data,
                    label: 'Budgeted: ' + response[1].label,
                    lines: { show: true},  
                    points: { show: true, radius: 7 },
                },
                {
                    data: response[0].data,
                    label: 'Spent: ' + response[0].label,
                    lines: { show: true}, 
                    points: { show: true, radius: 7 }
                }
            ],
            {
                colors: ['#a6db34', '#33a6db'],   
                legend: { show: true },
                grid: { borderWidth: 0, hoverable: true, clickable: true },
                yaxis: {min: 0, max: 1500, ticks: 10, tickColor: '#eeeeee' },
                xaxis: { 
                    min: 1,
                    max: 31,
                    ticks: 31,
                    tickColor: '#ffffff' 
                }
            }
        );
    }

Answer 1

.setupGrid和.draw是绘图对象的方法。从.plot调用返回>该绘图对象。

var chartTaggedSpending = $('#tagged-spending');
var myPlot = $.plot(chartTaggedSpending, etc.... // assign the return from $.plot
// sometime later
myPlot.setupGrid(); // use it later
myPlot.draw();

Flot图表不会重新绘制

1 个答案: