添加DataTable数据不起作用？

Question

我正在尝试让方法data.SetValue(...)在方法getNames中的异步回调中工作。不幸的是它不起作用。 data.setValue(...) 在同步方法createColumnChartView中工作。

这个问题的原因是什么？请解释为什么设置数据在getNames中不起作用。提前谢谢！

import java.util.ArrayList;
import com.google.gwt.core.client.GWT;
import com.google.gwt.user.client.rpc.AsyncCallback;
import com.google.gwt.user.client.ui.Widget; 
import com.google.gwt.visualization.client.DataTable;
import com.google.gwt.visualization.client.AbstractDataTable.ColumnType;
import com.google.gwt.visualization.client.visualizations.corechart.ColumnChart;
import com.google.gwt.visualization.client.visualizations.corechart.CoreChart;
import com.google.gwt.visualization.client.visualizations.corechart.Options;
import com.practicum.client.Product;
import com.practicum.client.rpc.ProductService;
import com.practicum.client.rpc.ProductServiceAsync;


public class DataOutColumnChart {
private final DataTable data = DataTable.create();
private final Options options = CoreChart.createOptions();
private final ProductServiceAsync productService = GWT.create(ProductService.class);

public DataOutColumnChart(Runnable runnable) {
}

public Widget createColumnChartView() {
    /* create a datatable */
    data.addColumn(ColumnType.STRING, "Price");
    data.addColumn(ColumnType.NUMBER, "EUR");
    data.addRows(2);
    data.setValue(0, 0, "Bar 1");
    data.setValue(0, 1, 123);
    getNames();

    /* create column chart */
    options.setWidth(400);
    options.setHeight(300);
    options.setBackgroundColor("#e8e8e9");

    return new ColumnChart(data, options);
}

public void getNames() {
    productService.getNames(new AsyncCallback<ArrayList<Product>>() {
        public void onFailure(Throwable caught) {
        }

        public void onSuccess(ArrayList<Product> result) {
            for (Product p : result) {
                data.setValue(0, 0, "Bar 2"); // DONT WORK, NOTHING HAPPENS
                data.setValue(0, 1, 345); // DONT WORK, NOTHING HAPPENS
                System.out.println("Bla bla test"); // THIS WORKS
            }
        }
    });
}
}

Answer 1

问题出现了，因为您要将数据设置为已经呈现的DataTable。 getNames()中的异步调用完成得太慢，无法及时影响DataTable呈现ColumnChart。即使 足够快地完成，它也总是一个竞争条件。理想情况下，在之后你已经从RPC调用中收到所有必要的数据之前，你实际上不会渲染该图表。

另一种选择是存储对ColumnChart的引用，并在从RPC获取数据后调用columnChart.draw(...)。

修改：

以下是您要求的示例。

import java.util.ArrayList;
import com.google.gwt.core.client.GWT;
import com.google.gwt.user.client.rpc.AsyncCallback;
import com.google.gwt.user.client.ui.Widget; 
import com.google.gwt.visualization.client.DataTable;
import com.google.gwt.visualization.client.AbstractDataTable.ColumnType;
import com.google.gwt.visualization.client.visualizations.corechart.ColumnChart;
import com.google.gwt.visualization.client.visualizations.corechart.CoreChart;
import com.google.gwt.visualization.client.visualizations.corechart.Options;
import com.practicum.client.Product;
import com.practicum.client.rpc.ProductService;
import com.practicum.client.rpc.ProductServiceAsync;


public class DataOutColumnChart {
    private final DataTable data = DataTable.create();
    private final Options options = CoreChart.createOptions();
    private final ProductServiceAsync productService = GWT.create(ProductService.class);
    private ColumnChart chart = null;

    public DataOutColumnChart(Runnable runnable) {
    }

    public void initColumnChart() {
        /* create a datatable */
        data.addColumn(ColumnType.STRING, "Price");
        data.addColumn(ColumnType.NUMBER, "EUR");

        /* create column chart */
        options.setWidth(400);
        options.setHeight(300);
        options.setBackgroundColor("#e8e8e9");

        chart = new ColumnChart(data, options);
    }

    public void getNames() {
        productService.getNames(new AsyncCallback<ArrayList<Product>>() {
            public void onFailure(Throwable caught) {
            }

            public void onSuccess(ArrayList<Product> result) {
                if (result != null && result.size() > 0) {
                    // if there is data...
                    data.addRows(result.size()); // add a row for each result
                    for (int i = 0; i < result.size(); i++) {
                        // loop through the results
                        Product product = result.get(i); // get out the product
                        // ...then set the column values for this row
                        data.setValue(i, 0, product.getSomeProperty());
                        data.setValue(i, 1, product.getSomeOtherProperty());
                    }
                    updateChart();
                }
            }
        });
    }

    public void updateChart() {
        chart.draw(data, options);
    }
}