🏠 back to Observable

dom surgery and css resize

On the x3dom mailing list, there was a question about how to make the x3d view resizable on the page. css is a little tricky with x3dom since it manages its own canvas and is itself an Unknown Element. Here is an explanation and solution:

The same technique can be used for svg elements although it probably is rarely useful for notebooks.

The notebook also shows how to be careful about modifying the scene since reparsing and loading the complete scene could be slow. It becomes a matter of avoiding automatic evaluation/reactivity when it is not desirable. Since the runtime does not track dom mutations on its page, one can surgically update a scene with dom manipulation methods. One could also use this to keep returning the same, potentially modified dom but keeping the modification code in a separate cell seems more transparent and is easier to understand.