简体   繁体   中英

Vaadin + VisJs: ResizeObserver loop limit exceeded

The problem is: ResizeObserver loop limit exceeded appearing at the browser as a notification dialog.

The steps are:

  • Using vaadin and creating a component for vis-js. Importing the vis-network any way you want, doesn't affect. Right now, my code has UI.getCurrent().getPage().addJavaScript("https://unpkg.com/vis-network/standalone/umd/vis-network.js"); but I've also used @JsModule and @JavaScript before.
  • Adding that component to a View .
  • Running a Js to create a simple graph (copy-pasted from vis-js examples page). No matter at which point in the lifecycle this is called.

The project setup is:

  • vis-network.js 9.1.0
  • Chrome browser 96.0.4664.110
  • Spring Boot 2.6.2-SNAPSHOT
  • Vaadin spring boot starter 14.7.7
  • Node v14.17.3
  • Java 16.0.1
  • Gradle 7.1

I'm gonna answer my own question. I wished to put here to help others and my future self.

After endless hours, the solution here was to set a style for the container informing the size of the container, for example:

div.getStyle().set("width", "600px").set("height", "400px");

or via css

      #mynetwork {
        width: 600px;
        height: 400px;
      }

where that div is the one you passed to:

...
var container = document.getElementById("mynetwork");
var network = new vis.Network(container, data, options);

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM