Reference Source

References

extras/ContextMenu

summary
public

A customizable HTML context menu.

extras/MarqueePicker

summary
public

Picks a Viewer's Entitys with a canvas-space 2D marquee box.

Usage

In the example below, we

  1. Create a Viewer, arrange the Camera
  2. Use an XKTLoaderPlugin to load a BIM model,
  3. Create a ObjectsKdTree3 to automatically index the Viewer's Entitys for fast spatial lookup, 4.
public

Controls a MarqueePicker with mouse input.

extras/PointerLens

summary
public

A PointerLens shows a magnified view of a Viewer's canvas, centered at the position of the mouse or touch pointer.

This component is used by DistanceMeasurementsControl and AngleMeasurementsControl to help position the pointer when snap-to-vertex or snap-toedge is enabled.

[Run example]


 import {Viewer, XKTLoaderPlugin, AngleMeasurementsPlugin, AngleMeasurementsMouseControl, PointerLens} from "../../dist/xeokit-sdk.es.js";

 const viewer = new Viewer({
     canvasId: "myCanvas",
     dtxEnabled: true
 });

 viewer.camera.eye = [-3.93, 2.85, 27.01];
 viewer.camera.look = [4.40, 3.72, 8.89];
 viewer.camera.up = [-0.01, 0.99, 0.039];

 const xktLoader = new XKTLoaderPlugin(viewer);

 const sceneModel = xktLoader.load({
     id: "myModel",
     src: "../../assets/models/xkt/v10/glTF-Embedded/Duplex_A_20110505.glTFEmbedded.xkt",
     edges: true
 });

 const angleMeasurements = new AngleMeasurementsPlugin(viewer);

 const angleMeasurementsMouseControl  = new AngleMeasurementsMouseControl(angleMeasurements, {
     pointerLens : new PointerLens(viewer, {
         zoomFactor: 2
     })
 })

 angleMeasurementsMouseControl.activate();

extras/collision

summary
public

Automatically indexes a Viewer's Entitys in a 3D k-d tree to support fast collision detection with 3D World-space axis-aligned boundaries (AABBs) and frustums.

See MarqueePicker for usage example.

An ObjectsKdTree3 is configured with a Viewer, and will then automatically keep itself populated with k-d nodes that contain the Viewer's Entitys.

plugins/AngleMeasurementsPlugin

summary
public

Measures the angle indicated by three 3D points.

public

Creates AngleMeasurements in an AngleMeasurementsPlugin from mouse input.

public

Viewer plugin for measuring angles.

public abstract

Creates AngleMeasurements in an AngleMeasurementsPlugin from user input.

plugins/AnnotationsPlugin

summary
public

A Marker with an HTML label attached to it, managed by an AnnotationsPlugin.

public

Viewer plugin that creates Annotations.

plugins/AxisGizmoPlugin

summary
public

Viewer plugin that shows the axii of the World-space coordinate system.

plugins/BCFViewpointsPlugin

summary
public

Viewer plugin that saves and loads BCF viewpoints as JSON objects.

plugins/CityJSONLoaderPlugin

summary
public

Default data access strategy for CityJSONLoaderPlugin.

public

Viewer plugin that loads models from CityJSON files.

since 2.0.13

plugins/DistanceMeasurementsPlugin

summary
public

Measures the distance between two 3D points.

public

Creates DistanceMeasurements in a DistanceMeasurementsPlugin from mouse input.

public

Viewer plugin for measuring point-to-point distances.

public abstract

Creates DistanceMeasurements in a DistanceMeasurementsPlugin from user input.

plugins/FaceAlignedSectionPlanesPlugin

summary
public

Controls a SectionPlane with mouse and touch input.

public

FaceAlignedSectionPlanesPlugin is a Viewer plugin that creates and edits face-aligned SectionPlanes.

plugins/FastNavPlugin

summary
public

Viewer plugin that makes interaction smoother with large models, by temporarily switching the Viewer to faster, lower-quality rendering modes whenever we interact.

plugins/GLTFLoaderPlugin

summary
public

Default data access strategy for GLTFLoaderPlugin.

public

Viewer plugin that loads models from glTF.

plugins/LASLoaderPlugin

summary
public

Default data access strategy for LASLoaderPlugin.

public

Viewer plugin that loads lidar point cloud geometry from LAS files.

since 2.0.17

plugins/NavCubePlugin

summary
public

Viewer plugin that lets us look at the entire Scene from along a chosen axis or diagonal.

plugins/OBJLoaderPlugin

summary
public

Viewer plugin that loads models from OBJ files.

plugins/STLLoaderPlugin

summary
public

Default data access strategy for STLLoaderPlugin.

public

Viewer plugin that loads models from STL files.

plugins/SectionPlanesPlugin

summary
public

SectionPlanesPlugin is a Viewer plugin that manages SectionPlanes.

plugins/SkyboxesPlugin

summary
public

Viewer plugin that manages skyboxes

plugins/StoreyViewsPlugin

summary
public

C Storey

Information about an IfcBuildingStorey.

public

A 2D plan view image of an IfcBuildingStorey.

public

A Viewer plugin that provides methods for visualizing IfcBuildingStoreys.

plugins/TreeViewPlugin

summary
public

A TreeViewPlugin render class.

public

A Viewer plugin that provides an HTML tree view to navigate the IFC elements in models.

public abstract

A node within a TreeViewPlugin.

plugins/ViewCullPlugin

summary
public

Viewer plugin that performs view frustum culling to accelerate rendering performance.

plugins/WebIFCLoaderPlugin

summary
public

Default data access strategy for WebIFCLoaderPlugin.

public

Viewer plugin that uses web-ifc to load BIM models directly from IFC files.

since 2.0.13

plugins/XKTLoaderPlugin

summary
public

Default data access strategy for XKTLoaderPlugin.

public

Viewer plugin that loads models from xeokit's optimized .XKT format.

[Run this example]

Overview

  • XKTLoaderPlugin is the most efficient way to load high-detail models into xeokit.
  • An .XKT file is a single BLOB containing a model, compressed using geometry quantization and pako.
  • Supports double-precision coordinates.
  • Supports compressed textures.
  • Set the position, scale and rotation of each model as you load it.
  • Filter which IFC types get loaded.
  • Configure initial default appearances for IFC types.
  • Set a custom data source for .XKT and IFC metadata files.
  • Option to load multiple copies of the same model, without object ID clashes.

Creating .XKT Files and Metadata

We have several sways to convert your files into XKT. See these tutorials for more info:

Scene representation

When loading a model, XKTLoaderPlugin creates an Entity that represents the model, which will have Entity#isModel set true and will be registered by Entity#id in Scene#models. The XKTLoaderPlugin also creates an Entity for each object within the model. Those Entities will have Entity#isObject set true and will be registered by Entity#id in Scene#objects.

Metadata

Since XKT V8, model metadata is included in the XKT file. If the XKT file has metadata, then loading it creates model metadata components within the Viewer, namely a MetaModel corresponding to the model Entity, and a MetaObject for each object Entity.

Each MetaObject has a MetaObject#type, which indicates the classification of its corresponding Entity. When loading metadata, we can also configure XKTLoaderPlugin with a custom lookup table of initial values to set on the properties of each type of Entity. By default, XKTLoaderPlugin uses its own map of default colors and visibilities for IFC element types.

For XKT versions prior to V8, we provided the metadata to XKTLoaderPlugin as an accompanying JSON file to load. We can still do that for all XKT versions, and for XKT V8+ it will override any metadata provided within the XKT file.

Usage

In the example below we'll load the Schependomlaan model from a .XKT file.

plugins/XML3DLoaderPlugin

summary
public

Viewer plugin that loads models from 3DXML files.

viewer

summary
public

Manages global configurations for all Viewers.

public

C Plugin

Base class for Viewer plugin classes.

public

C Viewer

The 3D Viewer at the heart of the xeokit SDK.

viewer/localization

summary
public

Localization service for a Viewer.

since 2.0

viewer/metadata

summary
public

Metadata corresponding to an Entity that represents a model.

public

Metadata corresponding to an Entity that represents an object.

public

Metadata corresponding to a Scene.

public

A property within a PropertySet.

public

A set of properties associated with one or more MetaObjects.

public

Initial properties for Entitys loaded from IFC models accompanied by metadata.

public

V IFCObjectDefaults: {String: Object}

Default initial properties for Entitys loaded from models accompanied by metadata.

viewer/scene

summary
public

Base class for all xeokit components.

public abstract

I Entity

An abstract 3D scene element that can be individually shown, hidden, selected, highlighted, xrayed, culled, picked, clipped and bounded.

public

V stats: {components: {models: number, objects: number, scenes: number, meshes: number}, memory: {indices: number, uvs: number, textures: number, materials: number, transforms: number, positions: number, programs: number, normals: number, meshes: number, colors: number}, build: {version: string}, client: {browser: string}, frame: {frameCount: number, useProgram: number, bindTexture: number, drawElements: number, bindArray: number, tasksRun: number, fps: number, drawArrays: number, tasksScheduled: number}}

xeokit runtime statistics.

viewer/scene/Bitmap

summary
public

C Bitmap

A plane-shaped 3D object containing a bitmap image.

viewer/scene/CameraControl

summary
public

Controls the Camera with user input, and fires events when the user interacts with pickable Entitys.

viewer/scene/ImagePlane

summary
public

A plane-shaped 3D object containing a bitmap image.

viewer/scene/LineSet

summary
public

A set of 3D line segments.

viewer/scene/camera

summary
public

C Camera

Manages viewing and projection transforms for its Scene.

public

Jumps or flies the Scene's Camera to a given target.

  • Located at Viewer#cameraFlight
  • Can fly or jump to its target.
  • While flying, can be stopped, or redirected to a different target.
  • Can also smoothly transition between ortho and perspective projections.

A CameraFlightAnimation's target can be:

public

Defines a sequence of frames along which a CameraPathAnimation can animate a Camera.

public

Animates the Scene's's Camera along a CameraPath.

public

Defines a custom projection for a Camera as a custom 4x4 matrix..

public

Defines its Camera's perspective projection as a frustum-shaped view volume.

  • Located at Camera#frustum.
  • Allows to explicitly set the positions of the left, right, top, bottom, near and far planes, which is useful for asymmetrical view volumes, such as for stereo viewing.
  • Frustum#near and Frustum#far specify the distances to the WebGL clipping planes.
public

C Ortho

Defines its Camera's orthographic projection as a box-shaped view volume.

  • Located at Camera#ortho.
  • Works like Blender's orthographic projection, where the positions of the left, right, top and bottom planes are implicitly indicated with a single Ortho#scale property, which causes the frustum to be symmetrical on X and Y axis, large enough to contain the number of units given by Ortho#scale.
public

Defines its Camera's perspective projection using a field-of-view angle.

viewer/scene/canvas

summary
public

C Canvas

Manages its Scene's HTML canvas.

public

Displays a progress animation at the center of its Canvas while things are loading or otherwise busy.

viewer/scene/constants

summary
public

Texture sampling mode that discards the RGBA components and just reads the A component.

public

Signed 8-bit integer type.

public

Texture wrapping mode in which the last pixel of the texture stretches to the edge of the mesh.

public

Media type for compressed texture data.

public

Texture sampling mode that reads each element as a single depth value, converts it to a float and clamps to [0,1].

public

Texture sampling mode that

public

Signed 32-bit floating-point type.

public

Media type for GIF images.

public

Signed 16-bit half-precision floating-point type.

public

Signed 32-bit integer type.

public

Media type for JPEG images.

public

Texture encoding mode in which the texture image is in linear color space.

public

Texture magnification and minification filter that returns the weighted average of the four nearest texels to the given sample coordinates.

public

Texture minification filter that chooses two mipmaps that most closely match the size of the pixel being textured, finds within each mipmap the weighted average of the nearest texel to the center of the pixel, then returns the weighted average of those two values.

public

Texture minification filter that chooses the mipmap that most closely matches the size of the pixel being textured and returns the weighted average of the four nearest texels to the given sample coordinates.

public

Texture minification filter that chooses two mipmaps that most closely match the size of the pixel being textured, finds within each mipmap the weighted average of the nearest texel to the center of the pixel, then returns the weighted average of those two values.

public

Texture minification filter that chooses the mipmap that most closely matches the size of the pixel being textured and returns the weighted average of the four nearest texels to the given sample coordinates.

public

Texture sampling mode that reads each of the RGBA texture components as a luminance/alpha value, converted to a float and clamped to [0,1].

public

Texture sampling mode that reads each RGB texture component as a luminance value, converted to a float and clamped to [0,1], while always reading the A channel as 1.0.

public

Texture wrapping mode in which the texture repeats to infinity, mirroring on each repeat.

public

Texture magnification and minification filter that returns the nearest texel to the given sample coordinates.

public

Texture minification filter that chooses two mipmaps that most closely match the size of the pixel being textured and returns the nearest texel to the center of the pixel at the given sample coordinates.

public

Texture minification filter that chooses the mipmap that most closely matches the size of the pixel being textured and returns the nearest texel to the given sample coordinates.

public

Texture minification filter that chooses two mipmaps that most closely match the size of the pixel being textured and returns the nearest texel to the center of the pixel at the given sample coordinates.

public

Texture minification filter that chooses the mipmap that most closely matches the size of the pixel being textured and returns the nearest texel to the given sample coordinates.

public

Media type for PNG images.

public

Texture sampling mode that reads the RGBA components.

public

Texture sampling mode that reads the RGBA components as integers instead of floats.

public

Texture format mode in which the texture is formatted as an ATSC compressed RGBA image.

public

Texture format mode in which the texture is formatted as an ATSC compressed RGBA image.

public

Texture format mode in which the texture is formatted as an ATSC compressed RGBA image.

public

Texture format mode in which the texture is formatted as an ATSC compressed RGBA image.

public

Texture format mode in which the texture is formatted as an ATSC compressed RGBA image.

public

Texture format mode in which the texture is formatted as an ATSC compressed RGBA image.

public

Texture format mode in which the texture is formatted as an ATSC compressed RGBA image.

public

Texture format mode in which the texture is formatted as an ATSC compressed RGBA image.

public

Texture format mode in which the texture is formatted as an ATSC compressed RGBA image.

public

Texture format mode in which the texture is formatted as an ATSC compressed RGBA image.

public

Texture format mode in which the texture is formatted as an ATSC compressed RGBA image.

public

Texture format mode in which the texture is formatted as an ATSC compressed RGBA image.

public

Texture format mode in which the texture is formatted as an ATSC compressed RGBA image.

public

Texture format mode in which the texture is formatted as an ATSC compressed RGBA image.

public

Texture format mode in which the texture is formatted as an BPTC compressed RGBA image.

public

Texture format mode in which the texture is formatted as an ETC2 compressed RGBA image.

public

Texture format mode in which the texture is formatted as a PVRTC compressed image, with RGBA compression in 2-bit mode and one block for each 8×4 pixels.

public

Texture format mode in which the texture is formatted as a PVRTC compressed image, with RGBA compression in 4-bit mode and one block for each 4×4 pixels.

public

Texture format mode in which the texture is formatted as a DXT1 compressed RGBA image.

public

Texture format mode in which the texture is formatted as a DXT3 compressed RGBA image.

public

Texture format mode in which the texture is formatted as a DXT5 compressed RGBA image.

public

Texture sampling mode that discards the A component and reads the RGB components.

public

Texture format mode in which the texture is formatted as an ETC1 compressed RGB image.

public

Texture format mode in which the texture is formatted as an ETC2 compressed RGB image.

public

Texture format mode in which the texture is formatted as a PVRTC compressed image, with RGB compression in 2-bit mode and one block for each 8×4 pixels.

public

Texture format mode in which the texture is formatted as a PVRTC compressed image, with RGB compression in 4-bit mode and one block for each 4×4 pixels.

public

Texture format mode in which the texture is formatted as a DXT1 compressed RGB image.

public

Texture sampling mode that discards the A and B components and just reads the R and G components.

public

Texture sampling mode that discards the A and B components and just reads the R and G components, as integers instead of floats.

public

Texture sampling mode that discards the GBA components and just reads the R component.

public

Texture sampling mode that discards the GBA components and just reads the R component, as an integer instead of as a float.

public

Texture wrapping mode in which the texture repeats to infinity.

public

Signed 16-bit integer type.

public

Unsigned 8-bit integer type.

public

Unsigned integer type for 24-bit depth texture data.

public

Unsigned 32-bit integer type.

public

Texture packing mode in which each RGBA channel is packed into 4 bits, for a combined total of 16 bits.

public

Texture packing mode in which the RGB channels are each packed into 5 bits, and the A channel is packed into 1 bit, for a combined total of 16 bits.

public

Unsigned 16-bit integer type.

public

Texture encoding mode in which the texture image is in sRGB color space.

viewer/scene/geometry

summary
public

Defines a shape for one or more Meshes.

public

A Geometry that keeps its geometry data in both browser and GPU memory.

public

A Geometry that keeps its geometry data solely in GPU memory, without retaining it in browser memory.

viewer/scene/geometry/builders

summary
public

Creates box-shaped Geometry.

public

Creates a box-shaped lines Geometry.

public

Creates a box-shaped lines Geometry from AABB.

public

Creates a cylinder-shaped Geometry.

public

Creates a grid-shaped Geometry.

public

Creates a plane-shaped Geometry.

public

Creates a 3D polyline Geometry.

public

Creates a 3D polyline from curve Geometry.

public

Creates a sphere-shaped Geometry.

public

Creates a torus-shaped Geometry.

public

Creates wireframe vector text Geometry.

viewer/scene/geometry/loaders

summary
public

F load3DSGeometry(scene: Scene, cfg: *): Object

Loads Geometry from 3DS.

public

F loadOBJGeometry(scene: Scene, cfg: *): Object

Loads Geometry from OBJ.

viewer/scene/input

summary
public

C Input

Meditates mouse, touch and keyboard events for various interaction controls.

viewer/scene/lights

summary
public

An ambient light source of fixed color and intensity that illuminates all Meshes equally.

public

A cube texture map.

public

A directional light source that illuminates all Meshes equally from a given direction.

public

C Light

A dynamic light source within a Scene.

public

A LightMap specifies a cube texture light map.

public

A positional light source that originates from a single point and spreads outward in all directions, with optional attenuation over distance.

public

A reflection cube map.

public

C Shadow

viewer/scene/marker

summary
public

C Marker

Tracks the World, View and Canvas coordinates, and visibility, of a position within a Scene.

public

A Marker with a billboarded and textured quad attached to it.

viewer/scene/materials

summary
public

Configures the appearance of Entitys when their edges are emphasised.

public

Configures the appearance of Entitys when they are xrayed, highlighted or selected.

public

Configures Fresnel effects for PhongMaterials.

public

Configures the normal rendered appearance of Meshes using the non-realistic but GPU-efficient Lambertian flat shading model for calculating reflectance.

public

Configures the shape of "lines" geometry primitives.

public
public

Configures the normal rendered appearance of Meshes using the physically-accurate metallic-roughness shading model.

public

Configures the normal rendered appearance of Meshes using the non-physically-correct Blinn-Phong shading model.

public

Configures the size and shape of "points" geometry primitives.

public

Configures the normal rendered appearance of Meshes using the physically-accurate specular-glossiness shading model.

public

A 2D texture map.

viewer/scene/mementos

summary
public

Saves and restores the state of a Scene's Camera.

See Also

public

Saves and restores a snapshot of the visual state of the Entity's of a model within a Scene.

Usage

In the example below, we'll create a Viewer and use an XKTLoaderPlugin to load an .xkt model.

public

Saves and restores a snapshot of the visual state of the Entity's that represent objects within a Scene.

See Also

viewer/scene/mesh

summary
public

C Mesh

An Entity that is a drawable element, with a Geometry and a Material, that can be connected into a scene graph using Nodes.

viewer/scene/mesh/draw

summary
public

F DrawShaderSource(mesh: *)

viewer/scene/metriqs

summary
public

Configures its Scene's measurement unit and mapping between the Real-space and World-space 3D Cartesian coordinate systems.

Overview

  • Located at Scene#metrics.
  • Metrics#units configures the Real-space unit type, which is "meters" by default.
  • Metrics#scale configures the number of Real-space units represented by each unit within the World-space 3D coordinate system. This is 1.0 by default.
  • Metrics#origin configures the 3D Real-space origin, in current Real-space units, at which this Scene's World-space coordinate origin sits, This is [0,0,0] by default.

viewer/scene/model

summary
public
this class was deprecated.

A high-performance model representation for efficient rendering and low memory usage.

public

A high-performance model representation for efficient rendering and low memory usage.

public

An entity within a SceneModel

public

A mesh within a SceneModel.

public

A texture within a SceneModelTextureSet.

public

A texture set within a SceneModel.

public

A dynamically-updatable transform within a SceneModel.

public
this class was deprecated.

A high-performance model representation for efficient rendering and low memory usage.

public

F uniquifyPositions(mesh: {positionsCompressed: number[], indices: number[], edgeIndices: number[]}): [Uint16Array, Uint32Array, Uint32Array]

This function obtains unique positionsCompressed in the provided object .positionsCompressed array and calculates an index mapping, which is then applied to the provided object .indices and .edgeindices.

public

F rebucketPositions(mesh: {positionsCompressed: number[], indices: number[], edgeIndices: number[]}, bitsPerBucket: number, checkResult: boolean): {positionsCompressed: number[], indices: number[], edgeIndices: number[]}[]

viewer/scene/model/dtx/lines

summary
public

F rebucketPositions(mesh: {positionsCompressed: number[], indices: number[], edgeIndices: number[]}, bitsPerBucket: number, checkResult: boolean): {positionsCompressed: number[], indices: number[], edgeIndices: number[]}[]

public

V dataTextureRamStats: {"sizeDataColorsAndFlags": *, "sizeDataPositionDecodeMatrices": *, "sizeDataTextureOffsets": *, "sizeDataTexturePositions": *, "sizeDataTextureIndices": *, "sizeDataTexturePortionIds": *, "numberOfGeometries": *, "numberOfPortions": *, "numberOfLayers": *, "numberOfTextures": *, "totalLines": *, "totalLines8Bits": *, "totalLines16Bits": *, "totalLines32Bits": *, "cannotCreatePortion": *, "overheadSizeAlignementIndices": *, "overheadSizeAlignementEdgeIndices": *}

viewer/scene/model/dtx/triangles/lib

summary
public

V dataTextureRamStats: {"sizeDataColorsAndFlags": *, "sizeDataPositionDecodeMatrices": *, "sizeDataTextureOffsets": *, "sizeDataTexturePositions": *, "sizeDataTextureIndices": *, "sizeDataTextureEdgeIndices": *, "sizeDataTexturePortionIds": *, "numberOfGeometries": *, "numberOfPortions": *, "numberOfLayers": *, "numberOfTextures": *, "totalPolygons": *, "totalPolygons8Bits": *, "totalPolygons16Bits": *, "totalPolygons32Bits": *, "totalEdges": *, "totalEdges8Bits": *, "totalEdges16Bits": *, "totalEdges32Bits": *, "cannotCreatePortion": *, "overheadSizeAlignementIndices": *, "overheadSizeAlignementEdgeIndices": *}

viewer/scene/nodes

summary
public

C Node

An Entity that is a scene graph node that can have child Nodes and Meshes.

viewer/scene/paths

summary
public

A Curve along which a 3D position can be animated.

public

C Curve

Abstract base class for curve classes.

public

C Path

A complex curved path constructed from various Curve subtypes.

public

A QuadraticBezierCurve is a Curve along which a 3D position can be animated.

public

A Curve along which a 3D position can be animated.

viewer/scene/postfx

summary
public

C SAO

Configures Scalable Ambient Obscurance (SAO) for a Scene.

viewer/scene/scene

summary
public

C Scene

Contains the components that comprise a 3D scene.

viewer/scene/sectionPlane

summary
public

An arbitrarily-aligned World-space clipping plane.

public

A set of arbitrarily-aligned World-space clipping planes.

viewer/scene/skybox

summary
public

C Skybox

A Skybox.

viewer/scene/utils

summary
public
public

C Loader

public
public
public

V Cache: {"enabled": *, "files": *, "add": *, "get": *, "remove": *, "clear": *}

public

viewer/scene/utils/textureTranscoders

summary
public

Transcodes texture data.

viewer/scene/utils/textureTranscoders/KTX2TextureTranscoder

summary
public

Transcodes texture data from KTX2.

viewer/scene/viewport

summary
public

viewer/scene/webgl

summary
public

Pick result returned by Scene#pick.

viewer/scene/webgl/occlusion

summary
public
public

Manages occlusion testing.