threepipe/website/package/plugin-tweakpane.md

---

prev: false next:

text: '@threepipe/plugin-blueprintjs'
link: './plugin-blueprintjs'

---

@threepipe/plugin-tweakpane

Tweakpane UI plugin for ThreePipe

Example — Source Code — API Reference

npm install @threepipe/plugin-tweakpane

TweakpaneUiPlugin adds support for using uiconfig-tweakpane to create a configuration UI in applications using the Tweakpane library.

The plugin takes the uiconfig that’s defined in the viewer and all the objects to automatically render a UI in the browser.

import {IObject3D, ThreeViewer, TonemapPlugin} from 'threepipe'
import {TweakpaneUiPlugin} from '@threepipe/plugin-tweakpane'

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

// Add the plugin
const plugin = viewer.addPluginSync(new TweakpaneUiPlugin(true)) // true to show expanded the UI by default

// Add the UI for the viewer
plugin.appendChild(viewer.uiConfig)
// Add UI for some plugins
plugin.setupPlugins(TonemapPlugin, DropzonePlugin)