K3D-tools / K3D-jupyter

K3D lets you create 3D plots backed by WebGL with high-level API (surfaces, isosurfaces, voxels, mesh, cloud points, vtk objects, volume renderer, colormaps, etc). The primary aim of K3D-jupyter is to be easy for use as stand alone package like matplotlib, but also to allow interoperation with existing libraries as VTK.
MIT License
953 stars 121 forks source link

Use ResizeObserver on DOM element #424

Closed sdrave closed 1 year ago

sdrave commented 1 year ago

Currently, K3D listens for browser window resize events. This causes issues when the DOM element into which K3D renders is resized for some reason while the browser window does not change its size. In particular, this often seems to be the case when when a K3D plot is placed into an ipywidgets container. By using a ResizeObserver on the targetDOMNode, this issue is avoided.

For example, on k3d-2.15.3 with

ipykernel==6.23.1
ipython==8.14.0
ipywidgets==8.0.6
jupyter-events==0.6.3
jupyter-lsp==2.2.0
jupyter_client==8.2.0
jupyter_core==5.3.0
jupyter_server==2.6.0
jupyter_server_terminals==0.4.4
jupyterlab==4.0.1
jupyterlab-pygments==0.2.2
jupyterlab-widgets==3.0.7
jupyterlab_server==2.22.1

I see the following issue:

k3d_mwe

With the proposed changes, the plot is correctly displayed.

artur-trzesiok commented 1 year ago

@sdrave I like that pull request! Thanks a lot!