Не удается получить несколько диаграмм (визуализация Google) на нескольких вкладках (панель GWT TabPanel) - PullRequest
Новая
       19

Не удается получить несколько диаграмм (визуализация Google) на нескольких вкладках (панель GWT TabPanel)

1 голос
/ 02 июля 2011

Мне нужно отобразить неизвестное количество вкладок с неизвестным количеством графиков (Google Visualizations). Я создал классы "Tab" и "Graph", а Tab содержит ArrayList.

TabWrappers расширяет FlexTable и в настоящее время пуст. На данный момент это заполнитель, но поведение не изменится, если я использую FlexTable, а не TabWrapper.

Код ниже, за исключением раздела, который добавляет Tab2, отлично подходит для создания 1 вкладки, заполненной графиками. При добавлении 2-й вкладки обе вкладки отображаются и называются правильно, но ни на одной из них нет графиков. 

    public class SomeClass {

...

        DataTable data = response.getDataTable();
        DataView result;
        Options options = createOptions();

        ArrayList<Tab> displayTab = new ArrayList<Tab>();
        Tab t;
        ArrayList<Graph> graphList = new ArrayList<Graph>();
        Graph g;

        t = new Tab();

            g = new Graph();
            result = DataView.create(data);
            result.setRows(new int[]{0, 2, 4, 6});
            g.setGraphType(new PieChart(result, options));
            graphList.add(g);

            g = new Graph();
            result = DataView.create(data);
            result.setRows(new int[]{1, 3, 5, 7});
            g.setGraphType(new PieChart(result, options));
            graphList.add(g);

            g = new Graph();
            result = DataView.create(data);
            g.setGraphType(new PieChart(result, options));
            graphList.add(g);

        t.setTabName("Tab1");
        t.setGraphs(graphList);
        displayTab.add(t);
        // Add a 2nd tab
        t = new Tab();
        t.setTabName("Tab2");
        t.setGraphs(graphList);
        displayTab.add(t);

        TabWrapper tabWrapper;
        for (Tab tX : displayTab){
            int row = 0, col = 0, maxCol = 2;
            tabWrapper = new TabWrapper();
            for (Graph gX : tX.getGraphs()) {
                col = tX.getGraphs().indexOf(gX) - (row * maxCol);
                tabWrapper.setWidget(row, col, gX.getGraphType().asWidget());
                if (++col == maxCol) {
                    row++;
                }
            }
        tabPanel.add(tabWrapper, tX.getTabName());
        }

...

    }

1 Ответ

2 голосов
/ 09 сентября 2011

Когда вы используете вкладки в GWT, панели, содержащиеся в каждой вкладке, кажутся загруженными с отложенной загрузкой и не полностью настроены, пока пользователь не нажмет на каждую вкладку.

В частности, контейнеры вкладок будут иметь нулевую ширину и высоту (журналы ошибок, вероятно, будут давать ошибку о контейнерах, имеющих нулевую ширину), поэтому рисование графика завершится ошибкой и оставит пустое пространство.

Что вам нужно сделать (и, вероятно, в любом случае это хорошая практика), так это лениво загрузить содержимое вкладок, чтобы график загружался только тогда, когда вкладка полностью настроена.Это можно сделать, удалив вызов t.setGraphs (...) и добавив обработчик выбора, который делает это вместо этого: 

tabPanel.addSelectionHandler(new SelectionHandler<Integer> () {
    public void onSelection(SelectionEvent<Integer> event) {
        // Pseudocode:
        // n = event.getSelectedItem()
        // t = displayTab[n]
        // g = graphList[n]
        // t.setGraphs(g)
    }
});

, чтобы графики добавлялись и рисовались толькокогда вкладка выбрана.

Возможно, вы также захотите вызвать 

tabPanel.selectTab(0);

, чтобы принудительно выбрать первую вкладку после установки обработчика выбора.

У меня были те же проблемы, которые вы описали, и это решило их.

...