java - 使用数据库中的数据创建图形的 GWT 可视化问题

Question

我在创建图表时遇到问题。图表的数据以 HashMap 形式来自数据库。以下是我的代码:

public void onModuleLoad()
{

    Runnable onLoadCallback = new Runnable() 
    {
        public void run() 
        {
            AbstractDataTable data = createLineTable();
            Options options = createLineOptions();
            LineChart line = new LineChart(data, options);
            vPanelWithGraph.add(line);
            vPanelWithGraph.add(closeGraphPopUp);
    };
    VisualizationUtils.loadVisualizationApi(onLoadCallback, LineChart.PACKAGE);
    popUpGraph.add(vPanelWithGraph);
}

private LineChart.Options createLineOptions() 
{
    Options options = Options.create();
    options.setWidth(400);
    options.setHeight(240);
    options.setTitle("Graph Name");
    return options;
}

private AbstractDataTable createLineTable() 
{       
    DataTable data = DataTable.create();
    data.addColumn(ColumnType.STRING, "Date");
    data.addColumn(ColumnType.NUMBER, "Number");

    HashMap<String,String> map = getDateAndWarningCount();
    data.addRows(2);

    String [] arrDate = new String [2];
    int  [] arrWarCount = new int [2];
    int i=0;
    Iterator it = map.entrySet().iterator();

    while (it.hasNext()) 
    {
        Map.Entry pairs = (Map.Entry)it.next();
        System.out.println(pairs.getKey() + " = " + pairs.getValue());
        arrDate[i]=""+pairs.getKey();
        arrWarCount[i]=Integer.parseInt((String)pairs.getValue());
        i++;
    }
    data.setValue(0, 0, arrDate[0]);// row column
    data.setValue(0, 1, 5);

    data.setValue(1, 0, arrDate[1]);
    data.setValue(1, 1, 6);

    return data;
}

private HashMap<String,String> getDateAndWarningCount()
{
    HashMap<String,String> map = null;
    SQLRunnerAsync service = (SQLRunnerAsync) GWT.create(SQLRunner.class);
    AsyncCallback<HashMap<String,String>>  callback = new AsyncCallback<HashMap<String,String>>()
    {
        @Override
        public void onFailure(Throwable caught) 
        {}

        @Override
        public void onSuccess(HashMap<String,String> result)
        {
            map  = (HashMap<String,String>)result;
        }
    };
    service.getHashMapValues(callback); 
    return map;
    }

}

应用程序正在创建一个带有图表的弹出窗口。当弹出图表出现时，它显示全 0。我打印出了 HashMap 的值， HashMap 正在填充正确的数据。无法弄清楚我在这里做错了什么。任何帮助将不胜感激。谢谢

以下是我编辑的代码......它有效......谢谢大家!

public DialogBox getPopUpWarningGraph()
    {               
        SQLRunnerAsync service = (SQLRunnerAsync) GWT.create(SQLRunner.class);
        AsyncCallback<LinkedHashMap<String, Integer>> callback = new AsyncCallback<LinkedHashMap<String, Integer>>()
        {
            @Override
            public void onFailure(Throwable caught) 
            {
            }

            @Override
            public void onSuccess(LinkedHashMap<String, Integer> result)
            {
                map = new LinkedHashMap<String,Integer>(result);

                Runnable onLoadCallback = new Runnable() 
                {
                    public void run() 
                    {
                        AbstractDataTable data = createLineTable(map);
                        Options options = createLineOptions();
                        LineChart lineChart = new LineChart(data, options);
                        vPanelWithGraph.add(lineChart);
                        vPanelWithGraph.add(closeGraphPopUp);
                    }
                };
                VisualizationUtils.loadVisualizationApi(onLoadCallback, LineChart.PACKAGE);             
            }
        };
        service.getDateAndWarningCount("",callback);
        popUpGraph.add(vPanelWithGraph);
        return popUpGraph;
    }

    private LineChart.Options createLineOptions() 
    {
        Options options = Options.create();
        options.setWidth(400);
        options.setHeight(240);
        options.setTitle("");
        return options;
    }

    private AbstractDataTable createLineTable(HashMap<String,Integer> map ) 
    {
        DataTable data = DataTable.create();
        data.addColumn(ColumnType.STRING, "Task");
        data.addColumn(ColumnType.NUMBER, "");

        data.addRows(map.size());

        Iterator it = map.entrySet().iterator();
        int i=0;
        while (it.hasNext()) 
        {
            Map.Entry pairs = (Map.Entry)it.next();
            data.setValue(i,0,pairs.getKey()+"");
            data.setValue(i,1,Integer.parseInt(pairs.getValue()+""));
            i++;
        }
        return data;
    }
}

所以基本上， getPopUpWarningGraph() 函数可以从任何类调用，它将返回一个带有图表的弹出窗口!

Answer 1

您的 getDateAndWarningCount() 在数据加载之前立即返回 - 并且它始终返回 null。

在 GWT(和 javascript)中，您必须异步编程 - 当系统调用您时执行您的代码。

在您的情况下，您必须在调用 onSuccess() 时执行绘图，因为这是您拥有可用数据的时候。

public void onModuleLoad()
{

    Runnable onLoadCallback = new Runnable() 
    {
        public void run() {
            // first get the data
            getDateAndWarningCount()
        }          
    };
    VisualizationUtils.loadVisualizationApi(onLoadCallback, LineChart.PACKAGE);
    popUpGraph.add(vPanelWithGraph);
}

private LineChart.Options createLineOptions() 
{
    Options options = Options.create();
    options.setWidth(400);
    options.setHeight(240);
    options.setTitle("Graph Name");
    return options;
}

private AbstractDataTable createLineTable(HashMap<String,String> map) 
{       
    DataTable data = DataTable.create();
    data.addColumn(ColumnType.STRING, "Date");
    data.addColumn(ColumnType.NUMBER, "Number");

    data.addRows(2);

    String [] arrDate = new String [2];
    int  [] arrWarCount = new int [2];
    int i=0;
    Iterator it = map.entrySet().iterator();

    while (it.hasNext()) 
    {
        Map.Entry pairs = (Map.Entry)it.next();
        System.out.println(pairs.getKey() + " = " + pairs.getValue());
        arrDate[i]=""+pairs.getKey();
        arrWarCount[i]=Integer.parseInt((String)pairs.getValue());
        i++;
    }
    data.setValue(0, 0, arrDate[0]);// row column
    data.setValue(0, 1, 5);

    data.setValue(1, 0, arrDate[1]);
    data.setValue(1, 1, 6);

    return data;
}

private HashMap<String,String> getDateAndWarningCount()
{
    HashMap<String,String> map = null;
    SQLRunnerAsync service = (SQLRunnerAsync) GWT.create(SQLRunner.class);
    AsyncCallback<HashMap<String,String>>  callback = new AsyncCallback<HashMap<String,String>>()
    {
        @Override
        public void onFailure(Throwable caught) 
        {}

        @Override
        public void onSuccess(HashMap<String,String> result)
        {
                            Runnable onLoadCallback = new Runnable() 
            {
                public void run() 
                {
                    AbstractDataTable data = createLineTable(map);
                    Options options = createLineOptions();
                    LineChart lineChart = new LineChart(data, options);
                    vPanelWithGraph.add(lineChart);
                    vPanelWithGraph.add(closeGraphPopUp);
                }
            };
            VisualizationUtils.loadVisualizationApi(onLoadCallback, LineChart.PACKAGE); 
        }
    };
    service.getHashMapValues(callback); 
    return map;
    }

}