图表不以gwt中的动态数据显示

时间:2012-10-27 09:37:35

标签: gwt google-visualization gwt-rpc

我创建了一个带有图表的gwt应用程序,并将其部署在Tomcat中。 我可以用静态数据显示图表。

我正在进行rpc调用以从数据库中获取数据。我想使用此数据绘制图表。 但是当我在tomcat中部署并运行我的应用程序时,不显示图表。显示图表标题并显示“无数据”消息而不是图表。

但我可以在警告框中显示检索到的数据。这意味着RPC成功。

以下是我使用的代码片段:

public class MyGWTApp implements EntryPoint {

    /**
     * Create a remote service proxy to talk to the server-side Greeting service.
     */
    private final DataServiceAsync dataService = GWT
            .create(DataService.class);


    /**
     * This is the entry point method.
     */
    @SuppressWarnings("deprecation")
    public void onModuleLoad() {

        Runnable onLoadCallback=new Runnable(){

            public void run()
            {       


                TabPanel tabPanel = new TabPanel();
                //tabPanel.setAnimationDuration(1000);
                tabPanel.getElement().getStyle().setMarginBottom(10.0, Unit.PX);
                tabPanel.setSize("100%", "100%");


                //code to populate datatable and setting options for motion chart here


                final MotionChart motionchart=new MotionChart(data, options);
                final ColumnChart columnchart=new ColumnChart(createCategoryTable(),createCategoryBarOptions());
                final ColumnChart columnchart2=new ColumnChart(createCategoryTable(),createCategoryBarOptions());
                final ColumnChart columnchart3=new ColumnChart(createCategoryTable(),createCategoryBarOptions());

                final PieChart pie=new PieChart(createSentimentTable(), createSentimentPieOptions());

                FlexTable flexTable=new FlexTable();
                FlexCellFormatter flexCellFormatter=flexTable.getFlexCellFormatter();

                flexCellFormatter.setHorizontalAlignment(0, 0, HasHorizontalAlignment.ALIGN_CENTER);
                flexCellFormatter.setVerticalAlignment(0, 0, HasVerticalAlignment.ALIGN_MIDDLE);
                //flexTable.addStyleName("cw-FlexTable");

                flexCellFormatter.setColSpan(0, 0, 2);


                flexTable.setWidget(0, 0, pie);
                flexTable.setWidget(1, 0,columnchart2);
                flexTable.setWidget(1, 1, columnchart3);

                FlexTable flexTable2=new FlexTable();
                FlexCellFormatter flexCellFormatter2=flexTable.getFlexCellFormatter();

                flexCellFormatter2.setHorizontalAlignment(0, 0, HasHorizontalAlignment.ALIGN_CENTER);
                flexCellFormatter2.setVerticalAlignment(0, 0, HasVerticalAlignment.ALIGN_MIDDLE);
                flexTable2.setWidget(0, 0, motionchart);


                //tabPanel.add(new HTML("Testing tab panel"),"Text");
                tabPanel.add(flexTable,"Charts");
                tabPanel.add(flexTable2,"Motion Chart");

                /*tabPanel.setHeight("600");
                tabPanel.setWidth("900");*/
                tabPanel.selectTab(0);


                RootPanel.get("motionChartContainer").add(tabPanel);
            }
        };


        VisualizationUtils.loadVisualizationApi(onLoadCallback, MotionChart.PACKAGE,ColumnChart.PACKAGE);


    }

通过GWt-RPC获取数据的代码

private AbstractDataTable createCategoryTable(){

          final DataTable data = DataTable.create();

          data.addColumn(ColumnType.STRING, "Category");
          data.addColumn(ColumnType.NUMBER,"TweetCount");

          //dataService.getRowIDData(input, callback)

          dataService.getRowIDData("category",
                    new AsyncCallback<List<Record>>(){
                        public void onFailure(Throwable caught) {
                            // Show the RPC error message to the user
                            System.out.println("RPC Call failed");
                            Window.alert("category : RPC call failed");
                        }

                        public void onSuccess(List<Record> result) {

                            data.addRows(result.size());

                            String msg;
                            msg=result.size()+"\n";
                            System.out.println(msg);

                            for(int i=0;i<result.size();i++)
                            {
                                data.setValue(i,0,result.get(i).getQualifier());
                                data.setValue(i,1,Integer.parseInt(result.get(i).getValue()));  

                                msg="\n"+" Qualifier : "+result.get(i).getQualifier()+"Value : "+Integer.parseInt(result.get(i).getValue());

                            }

                            Window.alert("category : RPC Call successfull :size"+ result.size()+"\n "+ msg);

                        }
                    });  


          return data;

      }

private AbstractDataTable createSentimentTable(){

           final DataTable data = DataTable.create();

           //final DataTable dTable = DataTable.create(jso);

           data.addColumn(ColumnType.STRING,"Sentiment");
           data.addColumn(ColumnType.NUMBER,"TweetCount");

           dataService.getRowIDData("sentiment",
                    new AsyncCallback<List<Record>>(){
                        public void onFailure(Throwable caught) {
                            // Show the RPC error message to the user
                            System.out.println("RPC Call failed");
                            Window.alert("Sentiment : RPC call failed");
                        }

                        public void onSuccess(List<Record> result) {

                            data.addRows(result.size());
                            String msg=result.size()+"\n";
                            System.out.println(msg);

                            for(int i=0;i<result.size();i++)
                            {
                                data.setValue(i,0,result.get(i).getQualifier());
                                data.setValue(i,1,Integer.parseInt(result.get(i).getValue()));  

                                msg="\n"+" Qualifier : "+result.get(i).getQualifier()+"Value : "+Integer.parseInt(result.get(i).getValue());

                            }

                            Window.alert("Sentiment :RPC Call successfull "+ msg);
                        }
                    });  

          return data;    

      }

1 个答案:

答案 0 :(得分:1)

问题在于

final ColumnChart columnchart=new ColumnChart(createCategoryTable(),createCategoryBarOptions());

createCategoryTable()方法不会等到RPC成功方法执行,因为它是异步的。所以它将返回空数据表。

解决方案是创建没有数据和选项的ColumnCharts。

final ColumnChart columnchart=new ColumnChart();

在RPC onSuccess()方法中,您可以将图表绘制为:

columnchart.draw(dataTable, options);