Graph processing and visualization in Cuba?

Support
#23

Hi Roman,

I have this component located inside a tabsheet container tab (not the main tab sheet). The component is called every-time when I revisit the tab which has this analytics connector. The issue is, If I have selected some entries on this chart and revisit the tab It reloads and shows the default callback chart.
I would like to have the changes preserved on tab change.
Please give me some pointer how to overcome this.
I followed this thread and tried to do the following but it did not work. (Avoid google map always init/render - #17 от пользователя tsarev - CUBA.Platform)

Any help would be appreciated.

Best,
Sanchit

#24

Hello,

Unfortunately, the approach described at the link is used only for the main TabSheet. The simple TabSheet does not unload components but tries to repaint them.

As a workaround, if your component provides API to restore the view state, you can do it in the TabSheet#addSelectedTabChangeListener()

For instance:

@Subscribe("tabSheet")
public void onTabSheetSelectedTabChange(TabSheet.SelectedTabChangeEvent event) {
    TabSheet.Tab tab = event.getSelectedTab();
    if ("myTab".equals(tab.getName())) {
        // restore state
    }
}
#25

Hello Roman,

Thank you for the quick response.
I do use the TabSelection change listener as I initialize the component inside the Tab.
I would appreciate If you could give me an example to restore the JS vaadin connector state.

Best,
Sanchit

#26

Hi,

any updates on this ?

#27

Hi,

you can see the example of how to set state in the Sampler project: java-script-component. Also, see the documentation.
The main idea is to save some values which we can get from callbacks and set state when Tab is selected. It will work if your JavaScript library provides API for set/get values.

I can guess your component always initializes when selecting a tab. As another option, try to define your JavaScriptComponent using declarative way in the tab element:

<tab id="test" caption="test">
    <jsComponent id="quill"
                 initFunctionName="com_company_demo_web_screens_Sandbox"
                 height="200px"
                 width="400px">
        <dependencies>
            <dependency path="webjar://quill:dist/quill.js"/>
             ...
        </dependencies>
    </jsComponent>
</tab>

You also can inject this component to the controller and configure specific properties.

The last option, unfortunately, is to change the screen layout and do not use JavaScriptComponent in TabSheet.