3D graphics in Jupyter notebook (ipynb)

Question

I'm searching for most convenient way how to insert 3D graphics into ipython (Jupyter) notebook? I mean some simple 3D model of machines (space-crafts in my case) mostly composed of simple primitives e.g. like CAD

What I want:

• people who read the notebook can interactively rotate the model
• The model is either loaded from file, or directly generated from python (or other) source code
• The model can be easily composed from simple primitives (lines, cones, cylinders, sphere ... ) within the code
• something which does not need some non-standard and hard-to-install dependecies, so anybody can easily run the notebook on this computer

Possible solution I found up to now (and problems):

• FreeCAD IPython integration (just proposal, does not seem to be finished)
• three.js - but I have no experience with neither Javascript nor it's integration into IPython, so I would prefer some python solution
  • seen.js seems to be exactly what I want, but again it is javascript
• Plot.ly - it is for data-visualization, rather than for visualization of 3D models
• PyOpenGL - a bit too low-level, and I'm not sure how well it runs in web browser and Jupyter - I did not found any example
• POVray - is not interactive, integration to IPython would be cumbersome (calling external render, and than loading resulting image)

Answer 1

I would recommend using PyVista with itkwidgets.

Check the following example.

import pyvista
from pyvista import examples
from itkwidgets import view
dataset = examples.load_uniform()
dataset
view(dataset, slicing_planes=True, ui_collapsed=True, shadow=False)

That gives you the following result.

Answer 2

If you need to open a 3D model into your Jupyter model (in .obj format that you can export from FreeCad) you can use obj2html (Jupyter Image Example).

You can do a simply hello world in this way:

! pip install obj2html
! wget https://gitlab.com/nicolalandro/obj2html/-/raw/main/test/assets/model.obj
from obj2html import obj2html
from IPython.display import display, HTML

obj2html('model.obj', 'index.html')

display(HTML('index.html'))

But probably for your models you also set light and camera in this way:

camera={
  "fov": 45,
  "aspect": 2,
  "near": 0.1,
  "far": 100,
  "pos_x": 0,
  "pos_y": 10,
  "pos_z": 20,
  "orbit_x": 0,
  "orbit_y": 5,
  "orbit_z": 0,
},
light={
  "color": "0xFFFFFF",
  "intensity": 1,
  "pos_x": 0,
  "pos_y": 10,
  "pos_z": 0,
  "target_x": -5,
  "target_y": 0,
  "target_z": 0,
},
obj_options={
  "scale_x": 30,
  "scale_y": 30,
  "scale_z": 30,
}
obj2html('model.obj', 'index.html', camera, light, obj_options)

You can read more at source code page (It use three.js) or in this medium article.