@threepipe/plugin-gltf-transform
npm install @threepipe/plugin-gltf-transform
GLTFDracoExportPlugin
Exports GLTFDracoExportPlugin that extends the default gltf exporter to compress the file (using KHR_draco_mesh_compression) after export.
Example —
To use, simply add the plugin to the viewer and export using the viewer.export
or viewer.exportScene
functions. This also adds UI options to AssetExporterPlugin
which are used when exporting using the plugin or using viewer.exportScene
The plugin overloads the default gltf exporter in the asset manager with GLTFDracoExporter
. Using the gltf-transform library, it compresses the exported gltf file using the khr_draco_mesh_compression extension.
Note - Only glb
export supported right now.
Sample Usage:
import {ThreeViewer, downloadBlob} from 'threepipe'
import {GLTFDracoExportPlugin} from '@threepipe/plugin-gltf-transform'
const viewer = new ThreeViewer({...})
viewer.addPluginSync(GLTFDracoExportPlugin)
await viewer.load('file.glb')
const blob = await viewer.exportScene({
compress: true, // this must be specified, by default it's false.
viewerConfig: true, // to export with viewer, scene and plugin settings
})
// download the file
downloadBlob(blob, 'scene.glb')
GLTFSpecGlossinessConverterPlugin
GLTFSpecGlossinessConverterPlugin that extends the default gltf exporter to compress the file after export.
npm install @threepipe/plugin-gltf-transform
Plugin that adds a gltf loader extension that automatically converts GLTF files with specular glossiness materials (KHR_materials_pbrSpecularGlossiness) to metallic roughness during import.
To use this plugin, simply add it to the viewer and import a file with viewer.load
with specular glossiness materials.
If confirm
is set to true, a confirmation dialog will be shown before the conversion.
To disable confirmation while loading a specific file, it can be passed as an option to viewer.load
:
Sample Usage:
import {ThreeViewer, downloadBlob} from 'threepipe'
import {GLTFDracoExportPlugin, GLTFSpecGlossinessConverterPlugin} from '@threepipe/plugin-gltf-transform'
const viewer = new ThreeViewer({...})
viewer.addPluginSync(GLTFDracoExportPlugin)
const plugin = viewer.addPluginSync(GLTFSpecGlossinessConverterPlugin) // it requires GLTFDracoExportPlugin
plugin.confirm = true // show a confirmation dialog before conversion
// customize the confirmation message
plugin.confirmMessage = "Convert KHR_materials_pbrSpecularGlossiness to KHR_materials_pbrMetallicRoughness?"
await viewer.load('file.glb', {
autoScale: true,
autoCenter: true,
confirmSpecGlossConversion: false, // prevents the confirmation dialog while loading this file, even if set to true in the plugin
})
TIP
The plugin uses viewer.dialog
API to show the confirmation dialog. If you want to customize the dialog, you can use the viewer.dialog
API to set a custom dialog component.