Skip to content

GLTFKHRMaterialVariantsPlugin

ExampleSource CodeAPI Reference

GLTFKHRMaterialVariantsPlugin adds support for importing and exporting glTF models with the KHR_materials_variants extension to load the model with different material variants/combinations. It also provides API and UI to change the current material variant.

The plugin automatically adds support for the extension when added to the viewer.

The materials are stored in object.userData._variantMaterials and are automatically loaded and saved when using the GLTFLoader.

Sample Usage

typescript
import {ThreeViewer, GLTFKHRMaterialVariantsPlugin, Mesh2} from 'threepipe'

const viewer = new ThreeViewer({...})

const variantsPlugin = viewer.addPluginSync(GLTFKHRMaterialVariantsPlugin)

// load some model
await viewer.load(model_url)

// list of all variants in the model (names and objects)
console.log(variantsPlugin.variants) 

// change the selected variant
variantsPlugin.selectedVariant = 'beach'

ThreePipe - Make 3D applications on the web