Repository files navigation

A package which create THREE.js controls on Dat.GUI

live example

First install the npm package

npm install three-dat.gui

Or with yarn

yarn add three-dat.gui

Let's create a simple THREE.js example which display a gui controller for ourTHREE.MeshStandardMaterial

importDatfrom'dat.gui';importinitfrom'three-dat.gui';// Import initialization methodinit(Dat);// Init three-dat.gui with Dat/*... init scene, renderer & camera*/vargui=newDat.GUI();vargeometry=newTHREE.BoxGeometry(1,1,1);varmaterial=newMeshStandardMaterial();varmesh=newTHREE.Mesh(geometry,material);scene.add(mesh);gui.addMaterial('standard_material',material);

You can add quickly many kind of THREE.js objects.

• THREE.Material withgui.addMaterial("name", material)
• THREE.Light withgui.addLight("name", light)
• THREE.Vector withgui.addVector("name", vector)
• THREE.Scene withgui.addScene("name", scene)
• THREE.Object3D withgui.addObject3D("name", object)
• THREE.Mesh withgui.addMesh("name", mesh)
• THREE.Fog withgui.addFog("name", fog)
• THREE.FogExp2 withgui.addFogExp2("name", fog)

• Add helpers onTHREE.Object3D
• Refactoring
• Climate