Skip to main content

Options

mousePointer​

.use​

  • Whether to use MousePointer.
  • default: true

.animation​

.duration​

  • Duration of the mouse pointer animation (in seconds).
  • default: 0.1

.ease​

.sizeScale​

  • Size scale of the mouse pointer relative to the cube size.
  • default: 0.08

.innerCircleScale​

  • Size scale of the inner circle relative to the outer circle.
  • default: 0.7

.opacity​

  • Opacity of the mouse pointer.
  • default: 0.3

.textureURL​

  • If provided, the mouse pointer will use it as a texture.
  • default: ““

pinchZoom​

.sensitivity​

  • Sensitivity of pinch zoom.
  • default: 1.3

controls​

.rotateSpeed​

.mouse​

  • Rotation speed of OrbitControls if PointerEvent.pointerType is “mouse”.
  • default: -0.35

.touch​

  • Rotation speed of OrbitControls if PointerEvent.pointerType is “touch”.
  • default: -0.6

.rotateSpeedDecay​

Scale of rotateSpeed at the maximum zoom relative to the rotateSpeed at the minimum zoom. If the rotateSpeed is too sensitive when zoomed in, decrease this value.

.cube​

Applied in cube view.

.mouse​
  • default: 0.3
.touch​
  • default: 0.2

.dollhouse​

Applied in dollhouse view.

.mouse​
  • default: 0.8
.touch​
  • default: 0.6

.panSpeed​

Pan speed of OrbitControls. Panning is only enabled in dollhouse view. To trigger the pan action, drag while the right mouse button is down if the pointerType is "mouse", or drag pointers in a parallel motion while two fingers are on the screen if the pointerType is "touch".

  • default: 1

.panSpeedDecay​

Scale of panSpeed at the maximum zoom relative to the panSpeed at the minimum zoom. If the panSpeed is too sensitive when zoomed in, decrease this value.

  • default: 0.5

.dampingFactor​

Damping factor of OrbitControls.

.mouse​

  • default: 0.09

.touch​

  • default: 0.2

cube​

.facePositionOrder​

The order of the face positions when you specify images for a specific resolution of a cube.

  • default: [“front”, “left”, “right”, “top”, “bottom”, “back”]

.rotationOrder​

rotation.order of a cube; see https://threejs.org/docs/index.html?q=objec#api/en/math/Euler.order.

  • default: “XYZ”

dollhouse​

.rotation​

type: “reverse” | “natural”

Whether the direction of the camera rotation is reversed in dollhouse view.

  • default: “reverse”

.animation​

.heightScale​

Scale of camera.position.y relative to the height of the dollhouse object when the animation starts.

  • default: 3

.polarAngle​

Polar angle of the camera when the animation starts.

  • default: Math.PI / 4

.duration​

The duration of the animation (in seconds).

  • default: 3

.ease​

The ease of the animation.

  • default: “power4.inOut”

.direction​

type: “counter-clockwise” | “clockwise”

The direction of the animation rotation.

  • default: “counter-clockwise”

transition​

Configurations related to various camera transitions.

.cubeToDollhouse​

Applied when going from cube view to dollhouse view.

.heightScale​

How high the camera should be at the end of the transition from cube view to dollhouse view relative to the height of a dollhouse object.

  • default: 3

.polarAngle​

Polar angle of the camera when transitioning in dollhouse view.

  • default: Math.PI / 4

.ease​

The ease of the animation.

  • default: “power2.inOut”

.duration​

The duration of the animation (in seconds).

  • default: 0.8

.dollhouseToCube​

Applied when going from dollhouse view to cube view.

.ease​

  • default: “power2.inOut”

.duration​

  • default: 0.7

.lookUp​

Applied when the polar angle of the camera is being set to Math.PI / 2.

.ease​
  • default: “power2.inOut”
.duration​
  • default: 0.3

.moveTarget​

Applied when OrbitControls.target is being moved to the position of the cube.

.ease​
  • default: “power1.out”
.duration​
  • default: 0.6

.cubeToCube​

Applied when going from the current cube to the next cube.

.ease​

  • default: “sine.inOut”

.duration​

  • default: 1

.waitTriggerMS​

The time to wait before TO_NEXT_CUBE:NEXT_CUBE_DELAYED event is fired.

  • default: 300 (in milliseconds)

floorHotspot​

.textureURL​

type: string | null

If provided, this will be used as a texture.

  • default: null

.sizeScale​

Size scale of the floor hotspot relative to the cube size.

  • default: 0.1

.opacity​

.cube​

Applied when in cube view.

.active​

Applied when hovered.

  • default: 0.6
.inactive​

Applied when not hovered.

  • default: 0.1

.dollhouse​

Applied when in dollhouse view.

.active​

Applied when hovered.

  • default: 0.9
.inactive​

Applied when not hovered.

  • default: 0.6

.animation​

.use​

Whether to use animation for opacity change.

  • default: true
.duration​
  • default: 0.3

.showDetectionBox​

Whether to show floor hotspot detection area. Useful for debugging purposes.

  • default: false

camera​

.fov​

fov of THREE.PerspectiveCamera.

  • default: 80

.near​

near of THREE.PerspectiveCamrea.

  • default: 0.1

.farScale​

This value will be multiplied by the cube size to calculate the far value of THREE.PerspectiveCamera.

  • default: 20

.zoom​

.min​

Minimum camera zoom value.

  • default: 1

.max​

Maximum camera zoom value.

  • default: 4

floor​

.neighborRadiusScale​

Scale value that is multiplied by the cube size to determine neighborRadius. Each FloorSpot will have neighboring FloorSpots from whose distance is less than neighborRadius.

  • default: 3

.cameraHeight​

The camera height of the floor.

note

Note that if you have multiple floors and if their camera heights could differ from one another, provide each camera height to World3D.createFloor() when you create the floors, instead of setting this value.

Only use this value when your floors have a uniform camera height.

  • default: 150 (in centimeter)

measurement​

.cubeBrightness​

How much darker the cube images should be when entering measurement:select or measurement:measure mode.

  • default: -0.1

.finishKey​

The keyboard key that will signal the end of a measuring interaction when in measurement:measure mode.

This value can be either KeyboardEvent.code or KeyboardEvent.key.

  • default: “Escape”

.verticalMeasuringKey​

The keyboard key to enter the vertical measuring mode when pressed in measurement:measure mode.

This value can be either KeyboardEvent.code or KeyboardEvent.key.

  • default: “ShiftLeft”

.horizontalMeasuringEscapeKey​

The keyboard key to escape from the horizontal measuring mode when pressed in measurement:measure mode.

This value can be either KeyboardEvent.code or KeyboardEvent.key.

  • default: “Meta”

.verticalSensitivity​

How sensitive the vertical snapping should be.

  • default: 0.07

.labelMinimumScale​

Minimum scale value for the measurement labels.

  • default: 0.5

.referenceRuler​

Reference ruler is only being rendered in measurement:measure mode.

.ring​

.size​

The size of the rings at both top and bottom of the ruler.

  • default: 15
.opacity​

The opacity of the rings.

  • default: 0.5

showInDollhouseView​

Whether to show MeasuringObjects in dollhouse view.

  • default: true

.magnifyingGlass​

.size​

The size of the magnifying glass.

  • default: 140

.zoomScale​

Magnification factor. The bigger the value, the more enlarged the image in the glass.

  • default: 15

.offset​

.x​

The horizontal offset of the glass relative to the default position.

  • default: 0
.y​

The vertical offset of the glass relative to the default position.

  • default: 0

.texture​

.url​

If provided, it’ll be used as a texture.

  • default: ““
.size​

The size of the texture.

  • default: 144
.offset​
.x​

The horizontal offset of the texture relative to the default position.

  • default: 0
.y​

The vertical offset of the texture relative to the default position.

  • default: 0

.measuringObject​

.dot​

.size​

The size of a dot.

  • default: 12
.color​

type: number | string

The color of a dot.

  • default: 0xffffff
.outlineColor​

type: number | string

The color of a dot outline.

  • default: 0xff0000
.outlineScale​

A relative size of the outline to the dot size.

  • default: 1.5
.textureURL​

type: string | null

If provided, it will be used as a texture.

  • default: null

.dotController​

.scale​

DotController exists as a proxy of a dot and responsible for various dot interactions. It is invisible but you can make it appear by setting Options.debug to true.

The value of scale has an effect on the size of the DotController; it’s THREE.Sprite in essence.

  • default: 0.09

.line​

.color​

type: number | string

The color of a line.

  • default: 0xffffff
.outlineColor​

type: number | string

The color of an outline of the line.

  • default: 0xff0000
.outlineScale​

Relative size of the outline to the line.

  • default: 2
.width​

The width of the line.

.drawingLine​

color​

type: number | string

The color of a drawing line.

  • default: 0xffffff
width​

The width of the drawing line.

.lineController​

.width​

The width of a LineController.

Similar to DotController, LineController acts as a proxy of a line that is responsible for handling line interactions.

It is invisible but you can make it appear by setting Options.debug to true.

  • default: 30

.label​

.decimals​

The number of decimal points to show in a MeasurementLabel.

  • default: 2
.style​

type: Partial<CSSStyleDeclaration>

CSS style that’s applied to the label.

  • default:
{
    backgroundColor: "#ffffff",
    position: "absolute", // absolute to the Floor.domElement
    top: "0", display: "flex", alignItems: "center",
    justifyContent: "center",
    userSelect: "none",
    padding: "0.25rem",
    whiteSpace: "nowrap"
}

.labelForAngle​

.decimals​

The number of decimal points to show in an AngleLabel.

  • default: 1
.distance​

The distance of the label from the target dot.

  • default: 0.06
.style​

type: Partial<CSSStyleDeclaration>

CSS style that’s applied to the label.

  • default:
{
    backgroundColor: "#ffffff",
    position: "absolute", // absolute to the Floor.domElement
    top: "0",
    display: "flex",
    alignItems: "center",
    justifyContent: "center",
    userSelect: "none",
    padding: "0.25rem",
    whiteSpace: "nowrap"
}

.magnifyingGlassScale​

Dots and DrawingLine will look much smaller in MagnifyingGlass. Probably because they are THREE.Points and THREE.Line as opposed to normal THREE.Object3D but not exactly sure what causes this issue.

So to compensate this, the scale value is multiplied to the original sizes of Dots and DrawingLine for the correct rendering inside MagnifyingGlass.

  • default: 10

.hidingDistanceScale​

Since the current measurement system in inherently inaccurate, it’s better to hide created MeasuringObjects if the camera moves too far from where they are created.

This scale value is multiplied to the cube size to determine the threshold for said hiding.

  • default: 3

debug​

Activate the debug mode.

In the debug mode, you’ll see a lot of otherwise invisible helper objects.

  • default: false

logEvents​

If true, events will be logged in the console whenever one is fired.

  • default: false