3D Viewer for Crabtree project

At University of Idaho Library we have recently been wrapping up the “Donald E. Crabtree Lithic Technology Collection” project by creating the new digital collection website.

Supported by a Digitizing Hidden Collections grant, this complex multi-year project involved digitizing thousands of archival objects and flitknapped artifacts (learn more on the About page). Each artifact was carefully photographed from multiple angles following a standardized procedure, including a unique GGOI process to enable extremely shiny lithic surfaces to be captured in detail. A smaller group was selected for 3D Photogrammetry, where dozens of overlapping images of an object are taken with 360 degree rotation, and then processed with software to generate 3D models (using Agisoft Metashape).

With thousands of images and hundreds of 3D model files (and accompanying metadata), it was time to make this fascinating content available via a customized CollectionBuilder-CSV website.

CB-CSV has one basic built in 3D model viewer option (“_includes/item/3d-model-viewer.html” using model-viewer) that supports GLB or GLTF models out of the box. However, our items had OBJ, STL, and X3D models only, and I had little desire to bulk convert all to generate new formats!

After testing a variety of javascript libraries and frameworks for presenting 3D models on static sites (including 3DHOP, cgwire, and threejs) I settled on Online 3D Viewer (o3dv) because it worked well and supports a wide variety of model formats. You can test out their fully featured viewer at 3dviewer.net.

I set up the basic implementation of o3dv and shared it as a “cb-add-on” repository, o3dv_cb-add-on. These “cb-add-on” repositories are packages of libraries, includes, and layouts to add new features into CB-CSV–download the code and drop it into your CB-CSV project!

For Crabtree collection, I started from that basic implementation and created a custom layout for our artifact items. Each artifact could have some 2D photographs and/or some 3D model files, so the challenge is to present all those options in a consistent item page. It incorporates a “gallery” feature for the 2D photographs. If 3D models are available, it adds a “View 3D Model” button which opens a full screen modal to display the 3D viewer. Loading the model with o3dv is handled by javascript, allowing us to change models and remove them when the modal is closed.

Try it out in this example, Ce. 1890

The source code is available at thecdil/crabtree_source.