building-editor
テスト
The goal of this project is to provide base implementation of web 3D editor for building/architecture which can be used easily. The codes are based on three.js editor fork, as we respect the great work of three.js.
Note: This project is under development. Please remember that there would be breaking changes. Or you can join us to make this project better for users.
Installation
npm install building-editor
Usage
import { Editor } from 'building-editor';
const editor = new Editor();
document.body.appendChild(editor.renderer.domElement);
const init = () => {
const width = window.innerWidth;
const height = window.innerHeight;
editor.renderer.setPixelRatio(window.devicePixelRatio);
editor.renderer.setSize(width, height);
editor.render();
}
init();
API
Editor
The main API of this library to create web 3D editor. This includes properties and actions. Note that you need to implement user interactions such as selected, hovered etc., using addEventListener since Editor itself does not provide it.
Constructor
Config,settings:Settings).
Editor(config:This creates a new Editor.
config - configuration data to specify cotrolability of editor (e.g. undo/redo, delete etc).
settings - setting data which summarize view setting such as renderer, camera, scene etc.
Properties
Config.
.config:configuration data to specify cotrolability of editor (e.g. undo/redo, delete etc).
Settings.
.settings:setting data which summarize view setting such as renderer, camera, scene etc.
EditorControls.
.editorControls:extension of THREE.EventDispatcher
THREE.WebGLRenderer.
.renderer:THREE.Camera.
.DEFAULT_CAMERA:History.
.history:Manage undo/redo history
Exporter.
.exporter:Utility class to export geometry in different format (e.g. obj, stl, dae etc)
Loader.
.loader:Utility class to load geometry file into editor
THREE.Camera.
.camera:THREE.Scene.
.scene:THREE.Scene.
.sceneHelpers:THREE.Object3D[].
.objects:THREE.Object3D[].
.INITIAL_OBJECTS:THREE.Object3D[].
.INITIAL_HELPERS:THREE.BufferGeometry}
.geometries:{[index:string]:THREE.Material}
.materials:{[index:string]:THREE.Texture}
.textures:{[index:string]:THREE.Material,number>
.materialsRefCounter: Map<THREE.AnimationClip[]}
aminations: {[index:string]:THREE.AnimationMixer
mixer:THREE.Object3D | null
selected:selected object in editor
THREE.Object3D | null
hovered:hovered object in editor
helpers: {[index:string]: Helper}
summarize following three helpers
- THREE.CameraHelper
- THREE.PointLightHelper
- THREE.DirectionalLightHelper
- THREE.SpotLightHelper
- THREE.HemisphereLightHelper
- THREE.SkeltonHelper
THREE.Camera}
cameras: {[index:string]:THREE.Camera
viewportCameras:THREE.OrbitControls
orbitControls:viewCubeControls:
THREE.GridHelper
gridHelper:THREE.AxesHelper
axesHelper:THREE.PlaneHelper
planeHelper:stencilPlane:
THREE.box3
box:THREE.BoxHelper
selectionBox:TransformControls
transformControls:THREE.Raycaster
raycaster:THREE.Vector2
mouse:contextMenu:
Event
event:Methods.
setConfig(config):void
objectChanged(object):void
showGridChanged(showGrid:boolean):void
render():void
setScene(scene):void
changeTransformModel(mode):void
addObject(object,parent,index):void
addObjectAsHelper(object):void
moveObject(object,parent,before):void
nameObject(object,name):void
removeObject(object):void
addGeometry(geometry):void
setGeometryName(geometry,name):void
addMaterial(material):void
addMaterialToRefCounter(material):void
removeMaterial(material):void
removeMaterialFromRefCounter(material):void
getMaterialById(id):THREE.Material | undefined
setMaterialName(material,name):void
addTexture(texture):void
addAnimation(object,animations):void
addCamera(camera):void
removeCamera(camera):void
addHelper(object):void
removeHelper(object):void
updateGridHelper(gridHelper):void
updateAxesHelper(axesHelper):void
updatePlaneHelper(planeHelper):void
clip(enabled):void
setDefaultCamera():void
setViewportCamera(uuid):void
select(object|null):void
selectNyId(id):void
selectByUuid(uuid):void
setHovered(object|null):void
focus(object):void
focusById(id):void
clear():void
fromJSON(json):void
toJSON():EditorJson
objectByUuid(uuid):THREE.Object3d|undefined
execute(cmd):void
undo():void
redo():void
BuildingEditorConfig).
Config(config?:BuildingEditorConfig.
Editor has many properties and methods. Please check Editor class to find them. The documents will be prepared later.