Overlap of cells with output

Hi All,

While waiting for my flight :slight_smile: I tried to get an example of a terra going, which inserts a canvas after an element; if I put the div at the beginning, the output overlaps with the following cells. Any ideas how to fix?

https://beta.observablehq.com/@sdwfrost/terra-demo

1 Like

Here you go:

https://beta.observablehq.com/@jashkenas/terra-demo

Terra’s insertAfter API is a bit awkward in an Observable notebook, because it wants to mutate an external cell.

In this forked version, we say that ex1 is a viewof, providing both a value: ex1 and a piece of DOM: the div containing the canvas element. In this way, ex1 can define itself, without having to mutate an external cell.

We’ve just deployed a new release that uses the new Resize Observer specification where available (which unfortunately is just Chrome for now according to Can I use). Resize Observers make Observable much more robust in detecting when cells resize asynchronously.

Alternatively, you can dispatch an update event to tell Observable explicitly that a cell has resized as shown in the Introduction to HTML notebook.

1 Like