API
API|
@babylonjs/viewer|
HTML3DElement

Class HTML3DElement

Displays a 3D model using the Babylon.js Viewer.

Hierarchy (View Summary)

Index
constructor
animationAutoPlay animationProgress animations animationSpeed cameraAutoOrbit cameraAutoOrbitDelay cameraAutoOrbitSpeed camerasAsHotSpots clearColor contrast engine environment environmentIntensity environmentLighting environmentRotation environmentSkybox exposure extension hotSpots isAnimationPlaying loadingProgress materialVariants renderWhenIdle resetMode selectedAnimation selectedMaterialVariant shadowQuality skyboxBlur source ssao toneMapping useOpenPBR viewerDetails
addEventListener focusHotSpot queryHotSpot reload removeEventListener reset resetCamera toggleAnimation
animationAutoPlay: boolean

True if the default animation should play automatically when a model is loaded.

animationProgress: number

The current point on the selected animation timeline, normalized between 0 and 1.

animationSpeed: number

The speed scale at which animations are played.

cameraAutoOrbit: boolean

Enables or disables camera auto-orbit.

cameraAutoOrbitDelay: Nullable<number>

The delay in milliseconds before the camera starts auto-orbiting.

cameraAutoOrbitSpeed: Nullable<number>

The speed at which the camera auto-orbits around the target.

camerasAsHotSpots: boolean

True if scene cameras should be used as hotspots.

clearColor: Nullable<Color4>

The clear color (e.g. background color) for the viewer.

contrast: Nullable<number>

The contrast applied to the scene.

engine: any

The engine to use for rendering.

  • get environment(): { lighting: Nullable<string>; skybox: Nullable<string> }

    The texture URLs used for lighting and skybox. Setting this property will set both environmentLighting and environmentSkybox.

    Returns { lighting: Nullable<string>; skybox: Nullable<string> }

  • set environment(url: string): void

    Parameters

    • url: string

    Returns void

environmentIntensity: Nullable<number>

A value between 0 and 2 that specifies the intensity of the environment lighting.

environmentLighting: Nullable<string>

The texture URL for lighting.

environmentRotation: Nullable<number>

A value in radians that specifies the rotation of the environment.

environmentSkybox: Nullable<string>

The texture URL for the skybox.

exposure: Nullable<number>

The exposure applied to the scene.

extension: Nullable<string>

Forces the model to be loaded with the specified extension.

If this property is not set, the extension will be inferred from the model URL when possible.

hotSpots: Record<string, HotSpot>

The set of defined hot spots.

  • get loadingProgress(): number | boolean

    Gets information about loading activity.

    Returns number | boolean

    false indicates no loading activity. true indicates loading activity with no progress information. A number between 0 and 1 indicates loading activity with progress information.

renderWhenIdle: boolean

When true, the scene will be rendered even if no scene state has changed.

resetMode: ResetMode

Determines the behavior of the reset function, and the associated default reset button.

  • "auto" - Resets the camera to the initial pose if it makes sense given other viewer state, such as the selected animation.
  • "reframe" - Reframes the camera based on the current viewer state (ignores the initial pose).
  • [ResetFlag] - A space separated list of reset flags that reset various aspects of the viewer state.
selectedAnimation: Nullable<number>

The currently selected animation index.

selectedMaterialVariant: Nullable<string>

The currently selected material variant.

shadowQuality: Nullable<"normal" | "none" | "high">

The type of shadows to use.

skyboxBlur: Nullable<number>

A value between 0 and 1 that specifies how much to blur the skybox.

source: Nullable<string>

The model URL.

ssao: Nullable<"enabled" | "auto" | "disabled">

Enables or disables screen space ambient occlusion (SSAO).

toneMapping: Nullable<"none" | "standard" | "aces" | "neutral">

The tone mapping to use for rendering the scene.

useOpenPBR: boolean

If true, load glTF files using the OpenPBR material instead of the default PBR material.