Type alias Settings

Type declaration

• axes: Partial<GizmoOptions>

  Axes gizmo options

• background: {
      color: THREE.Color;
  }

  Rendering background options

  • color: THREE.Color

    Color of the cavas background Default: THREE.Color('#96999f')

• camera: {
      allowedMovement: THREE.Vector3;
      allowedRotation: THREE.Vector2;
      controls: {
          moveSpeed: number;
          orbit: boolean;
          orbitSpeed: number;
          rotateSpeed: number;
      };
      far: number;
      forward: THREE.Vector3;
      fov: number;
      gizmo: {
          color: THREE.Color;
          enable: boolean;
          opacity: number;
          opacityAlways: number;
          size: number;
      };
      near: number;
      orthographic: boolean;
      zoom: number;
  }

  Three.js camera related options

  • allowedMovement: THREE.Vector3

    Vector3 of 0 or 1 to enable/disable movement along each axis Default: THREE.Vector3(1, 1, 1)

  • allowedRotation: THREE.Vector2

    Vector2 of 0 or 1 to enable/disable rotation around x or y. Default: THREE.Vector2(1, 1)

  • controls: {
        moveSpeed: number;
        orbit: boolean;
        orbitSpeed: number;
        rotateSpeed: number;
    }

    Camera controls related options

    • moveSpeed: number

      Camera movement speed factor Default: 1

    • orbit: boolean

      Set true to start in orbit mode.

      Camera has two modes: First person and orbit

      First person allows to moves the camera around freely

      Orbit rotates the camera around a focus point

      Default: true

    • orbitSpeed: number

      Camera orbit rotation speed factor. Default: 1

    • rotateSpeed: number

      Camera rotation speed factor Default: 1

  • far: number

    Far clipping plane distance Default: 15000

  • forward: THREE.Vector3

    Initial forward of the camera THREE.Vector3(1, -1, 1)

  • fov: number

    Fov angle in degrees Default: 50

  • gizmo: {
        color: THREE.Color;
        enable: boolean;
        opacity: number;
        opacityAlways: number;
        size: number;
    }

    Camera gizmo related options

    • color: THREE.Color

      Color of camera gizmo. Default: THREE.Color(255, 255, 255)

    • enable: boolean

      Enables/Disables camera gizmo. Default: true

    • opacity: number

      Opacity of the camera gizmo. Default: 0.5

    • opacityAlways: number

      Opacity of the camera gizmo when behind objects. Default: 0.125

    • size: number

      Size of camera gizmo. Default: 0.01

  • near: number

    Near clipping plane distance Default: 0.01

  • orthographic: boolean

    Start with orthographic camera Default: false

  • zoom: number

    Camera zoom level Default: 1

• canvas: {
      id: string | undefined;
      resizeDelay: number;
  }

  Webgl canvas related options

  • id: string | undefined

    Canvas dom model id. If none provided a new canvas will be created Default: undefined.

  • resizeDelay: number

    Limits how often canvas will be resized if window is resized in ms. Default: 200

• groundPlane: {
      color: THREE.Color;
      encoding: TextureEncoding;
      opacity: number;
      size: number;
      texture: string;
      visible: boolean;
  }

  Ground plane under the scene options.

  • color: THREE.Color

    Color of the plane Default: THREE.Color(0xff, 0xff, 0xff)

  • encoding: TextureEncoding

    Controls how the texture will be retrieved using the texture field. Default: base64

  • opacity: number

    Opacity of the plane Default: 1

  • size: number

    Size of the ground plane relative to the model Default: 5

  • texture: string

    Local or remote texture url for plane Default: Vim halo ground provided with the viewer.

  • visible: boolean

    Enables/Disables plane under scene Default: true

• materials: {
      highlight: {
          color: THREE.Color;
          opacity: number;
      };
      isolation: {
          color: THREE.Color;
          opacity: number;
      };
      outline: {
          blur: number;
          color: THREE.Color;
          falloff: number;
          intensity: number;
      };
      section: {
          strokeColor: THREE.Color;
          strokeFalloff: number;
          strokeWidth: number;
      };
  }

  Object highlight on click options

  • highlight: {
        color: THREE.Color;
        opacity: number;
    }

    Highlight on hover options

    • color: THREE.Color

      Highlight color Default: rgb(106, 210, 255)

    • opacity: number

      Highlight opacity Default: 0.5

  • isolation: {
        color: THREE.Color;
        opacity: number;
    }

    Isolation materials options

    • color: THREE.Color

      Isolation materials color Default: rgb(78, 82, 92)

    • opacity: number

      Isolation materials opacity Default: 0.08

  • outline: {
        blur: number;
        color: THREE.Color;
        falloff: number;
        intensity: number;
    }

    Selection outline options

    • blur: number

      Selection outline blur. Default: 2

    • color: THREE.Color

      Selection outline color. Default: rgb(0, 255, 255)

    • falloff: number

      Selection outline falloff. Default: 3

    • intensity: number

      Selection outline intensity. Default: 3

  • section: {
        strokeColor: THREE.Color;
        strokeFalloff: number;
        strokeWidth: number;
    }

    Section box intersection highlight options

    • strokeColor: THREE.Color

      Intersection highlight stroke color. Default: rgb(246, 246, 246)

    • strokeFalloff: number

      Intersection highlight stroke falloff. Default: 0.75

    • strokeWidth: number

      Intersection highlight stroke width. Default: 0.01

• rendering: {
      onDemand: boolean;
  }

  • onDemand: boolean

    Enable on-demand rendering which wait for changes before rendering to the canvas. Default: true

• skylight: {
      groundColor: THREE.Color;
      intensity: number;
      skyColor: THREE.Color;
  }

  Skylight (hemisphere light) options

  • groundColor: THREE.Color

    Skylight ground color. Default: THREE.Color(242, 213, 181)

  • intensity: number

    Skylight intensity. Default: 0.8

  • skyColor: THREE.Color

    Skylight sky Color. Default: THREE.Color(153, 204, 255)

• sunLights: {
      color: THREE.Color;
      intensity: number;
      position: THREE.Vector3;
  }[]

  Sunlight (directional light) options Two Blue-Green lights at odd angles. See defaultViewerSettings.