0

我正在使用 Ext flot 在我的应用程序上绘制图表。我想用 ajax 请求或按钮更新图表数据。我无法更新值。有人有想法吗？

var graphDataArr = [{ label: 'My Graph', data: myDataArray, color: '#46F252', hoverable: false, clickable: false }];

new Ext.Window({
    header      : false,
    layout      : 'anchor',
    height      : 200,
    width       : 750,
    baseCls     : 'ext_panel_header_bar',
    items       : [ {
        xtype       : 'flot',
        id          : 'flotGraph',
        cls         : 'x-panel-body',
        series      : graphDataArr,
        xaxis       : {
            min : xMin,
            max : xMax
        },
        yaxis       : {
            min : yMin,
            max : yMax
        },
        tooltip     : false,
        anchor      : '98% 99%'
    } ]
}).show();
4

2 回答 2

2

Ext Flot API 文档说：

setData( Array Series ) : void

You can use this to reset the data used. Note that axis scaling, ticks, legend etc. will not be recomputed (use setupGrid() to do that). You'll probably want to call draw() afterwards. 

You can use this function to speed up redrawing a plot if you know that the axes won't change. Put in the new data with setData(newdata) and call draw() afterwards, and you're good to go.

您可以在按钮处理程序中执行以下操作（dataArray新数据数组在哪里）：

var chart = Ext.getCmp('flotGraph');    
chart.setData(dataArray);
chart.setupGrid();
chart.draw();
于 2013-04-19T19:33:04.840 回答
0

如果您从 Web 应用程序以 Json/Proper 格式发送记录，那么您可以简单地创建可以在按钮/提交按钮上调用的 JavaScript。

    function createCharts() {

    var queryString = $('#mainForm').formSerialize();
    var url_String = "runChartData.action" + '?'+queryString+'&selectedModule=Line';// URL to call ajax

    $.ajax({ 
          type: "post",
          dataType: "json",
          url: url_String,
          async : true,
          success: function(data){ 

                chartData = data;

                        createChart(data); // the Method you have Created As I have created Bellow


        }, error: function(data){
            $('#chartDiv').empty(); //empty chart Div to recreate it.

        }
     });
}


createChart(var myDataArray){

$('#chartDiv').empty(); // reset to Create New Chart with new Data

var graphDataArr = [{ label: 'My Graph', data: myDataArray, color: '#46F252', hoverable: false, clickable: false }];

new Ext.Window({
    header      : false,
    layout      : 'anchor',
    height      : 200,
    width       : 750,
    baseCls     : 'ext_panel_header_bar',
    items       : [ {
        xtype       : 'flot',
        id          : 'flotGraph',
        cls         : 'x-panel-body',
        series      : graphDataArr,
        xaxis       : {
            min : xMin,
            max : xMax
        },
        yaxis       : {
            min : yMin,
            max : yMax
        },
        tooltip     : false,
        anchor      : '98% 99%'
    } ]
}).show();

}
于 2013-04-24T06:04:46.623 回答