Skip to content
Pre-release
Pre-release

@xeolabs xeolabs released this Oct 22, 2019 · 184 commits to master since this release

Overview

This xeokit SDK v0.5.0 beta release includes: support for larger BIM models, 2D plan views and mini-maps, ability to save and restore viewer state, improved BCF support, plus numerous enhancements and bug fixes. Many thanks to UniZite, BIMData, BIMSpot and D-Studio for helping with this release.

Contents

  • These links don't work in GitHub release pages

Contributors

Special thanks to:

Load Large Models Faster

Geometry Reuse in .XKT Format

xeokit's compressed binary .XKT model format is now even more efficient to load and render, thanks to the efforts of Toni Marti at UniZite.

We're calling this .XKT format V2. The xeokit-gltf-to-xkt conversion tool and XKTLoaderPlugin are also updated to support .XKT V2.

To achieve this performance improvement, Toni extended the .XKT format to reuse geometries within the model. A case where we would reuse geometries is the windows in a building, where we would have a single geometry representing the shape of a window, which is reused by all the window objects.

This has several benefits:

  • reduces file size, making models load faster,
  • consumes less browser and GPU memory, allowing bigger models,
  • consumes less GPU bandwidth, and
  • renders more efficiently using WebGL hardware instancing.

The table below shows the reductions in file size, time to convert from glTF, and loading time:

EElsbWBXkAA-KXO

Storey Plan Views

The new StoreyPlansPlugin provides a flexible set of building blocks with which we can build a variety of UX for navigating the storeys within our BIM models.

The plugin supports most of the UX flavors found in existing BIM viewers. There are two general flavors:

  1. navigate plan views within the main viewer canvas (usually 2D orthographic), and
  2. interactive mini-maps to help us navigate storeys in the viewer canvas (usually in first-person mode).

2D Plan Views

We can use StoreyViewsPlugin to set up views (often orthographic plan views) of building storeys within the main 3D view.

Mini-maps

We can also use StoreyViewsPlugin to generate mini-maps that you can use to track your current position within a storey, or fly to the location you click on.

Peek-2019-10-22-10-57

Transformable Models

We can now rotate, scale and translate .xkt and glTF models as we load them. This lets us load multiple models, or even multiple copies of the same model, and position them apart from each other.

Previously, GLTFLoaderPlugin only supported these transformations when configured with performance:false.

Screenshot from 2019-09-03 17-51-50

import {Viewer} from "../src/viewer/Viewer.js";
import {XKTLoaderPlugin} from "../src/plugins/XKTLoaderPlugin/XKTLoaderPlugin.js";

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

viewer.camera.eye = [-5.13, 16.83, 39.46];
viewer.camera.look = [22.20, 1.86, 4.44];
viewer.camera.up = [0.19, 0.94, -0.25];

const xktLoader = new XKTLoaderPlugin(viewer);

var i = 0;

xktLoader.load({
        src: "./models/xkt/duplex/duplex.xkt",
        metaModelSrc: "./metaModels/duplex/metaModel.json",
        edges: true,
        scale: [0.5, 0.5, 0.5],
        position: [i++ * 10, 0, 0]
    })
    .on("loaded", () => {
        xktLoader.load({
                src: "./models/xkt/duplex/duplex.xkt",
                metaModelSrc: "./metaModels/duplex/metaModel.json",
                edges: true,
                scale: [0.5, 0.5, 0.5],
                position: [i++ * 10, 0, 0]
            })
            .on("loaded", () => {
                xktLoader.load({
                        src: "./models/xkt/duplex/duplex.xkt",
                        metaModelSrc: "./metaModels/duplex/metaModel.json",
                        edges: true,
                        scale: [0.5, 0.5, 0.5],
                        position: [i++ * 10, 0, 0]
                    })
                    .on("loaded", () => {
                        xktLoader.load({
                                src: "./models/xkt/duplex/duplex.xkt",
                                metaModelSrc:
                                    "./metaModels/duplex/metaModel.json",
                                edges: true,
                                scale: [0.5, 0.5, 0.5],
                                position: [i++ * 10, 0, 0]
                            })
                            .on("loaded", () => {
                                xktLoader.load({
                                    src: "./models/xkt/duplex/duplex.xkt",
                                    metaModelSrc:
                                        "./metaModels/duplex/metaModel.json",
                                    edges: true,
                                    scale: [0.5, 0.5, 0.5],
                                    position: [i++ * 10, 0, 0]
                                });
                            });
                    });
            });
    });

CLI glTF to XKT Converter

The xeokit-gltf-to-xkt conversion tool can now be run from the command line, thanks to Hugo Duroux at BIMData.

This means that we can now use scripts to fully automate the conversion of IFC, COLLADA and glTF models to xeokit's optimized binary .xkt format

Picking Enhancements

Picking is where we select objects, either at given canvas coordinates or with an arbitrarily-positioned 3D ray. This release supports two more options for picking:

  1. option to pick invisible entities, and
  2. option to provide a matrix when ray-picking, as an alternative way to indicate the ray.

In the example below, we'll pick whatever Entity intersects the given ray, even if the Entity is currently invisible:

const pickResult = myViewer.scene.pick({
    pickInvisible: true,   // Picking both visible and invisible Entitys
    origin: [10,10,10],
    dir: [-10, -10, -10]
});

if (pickResult) { // Picked an Entity with the ray
    // ....
}

In the second example, we'll pick the Entity that intersects a ray, which we'll implicitely provide as a 4x4 matrix:

const pickMatrix = math.lookAtMat4v([0,10,0], [0,-1,0], [0,0,-1]); // Eye, look and up vectors
const pickResult = myViewer.scene.pick({
    pickMatrix: pickMatrix
});

if (pickResult) { // Picked an Entity with the ray
    // ....
}

Canvas Snapshot Improvements

When taking a canvas snapshot, xeokit now 1) temporarily resizes the canvas to the target width and height, 2) takes the snapshot, then 3) restores the canvas size. This allows us to take snapshots that have a different aspect ratio to the canvas, and also improves their sharpness, since xeokit no longer needs to scale the captured image to the target width and height.

For example, to take a square snapshot of a panorama-shaped canvas:

const imageData = viewer.getSnapshot({
    format: "png",
    width: 200,
    height: 200
});

Screenshot from 2019-09-25 19-22-56

Support BCF view_setup_hints

BCFViewpointsPlugin now saves and loads view_setup_hints in BCF viewpoints.

When saving a viewpoint, we can selectively save properties into view_setup_hints like this:

const bcfViewpoints = new BCFViewpintsPlugin(viewer);

const viewpoint = bcfViewpoints.getViewpoint({ // Options
    spacesVisible: false, // Don't force IfcSpace types visible in viewpoint (default)
    spaceBoundariesVisible: false, // Don't show IfcSpace boundaries in viewpoint (default) 
    openingsVisible: false // Don't force IfcOpening types visible in viewpoint (default)
});

When loading a viewpoint, BCFViewpointplugin will load those properties if they are found in the viewpoint.

Save and Restore Viewer State

New memento classes allow us to save and restore the state of the Viewer. These are useful when we need to temporarily switch to some view of our model, then switch back to the previous view when finished.

The StoreyViewsPlugin (see above) uses these mementos to transition to and from isolated views of building storeys. When switching to an isolated view, the plugin first saves the current camera and object states to mementos before showing the view. When the user wants to transition back to the previous view, StoreyViewsPlugin then restores the camera and objects from the mementos.

There are two memento classes: CameraMemento and ObjectsMemento.

CameraMemento

In the example below, we'll create a Viewer and use an XKTLoaderPlugin to load a .xkt model. When the model has loaded, we'll save a snapshot of the Camera state in a CameraMemento. Then we'll move the Camera, and then we'll restore its original state again from the CameraMemento.

 import {Viewer} from "../src/viewer/Viewer.js";
 import {CameraMemento} from "../src/scene/mementos/CameraMemento.js";
 
 const viewer = new Viewer({
      canvasId: "myCanvas"
 });
 
 // Load a model
 const xktLoader = new XKTLoaderPlugin(viewer);
 
 const model = xktLoader.load({
     id: "myModel",
     src: "./models/xkt/schependomlaan/schependomlaan.xkt"
 });
 
 // Set camera
 viewer.camera.eye = [-2.56, 8.38, 8.27];
 viewer.camera.look = [13.44, 3.31, -14.83];
 viewer.camera.up = [0.10, 0.98, -0.14];
 
 model.on("loaded", () => {
 
    // Model has loaded
 
    // Save memento of camera state
    const cameraMemento = new CameraMemento();
 
    cameraMemento.saveCamera(viewer.scene);
 
    // Move the camera
    viewer.camera.eye = [45.3, 2.00, 5.13];
    viewer.camera.look = [0.0, 5.5, 10.0];
    viewer.camera.up = [0.10, 0.98, -0.14];
 
    // Restore the camera state again
    objectsMemento.restoreCamera(viewer.scene);
});

ObjectsMemento

In the example below, we'll create a Viewer and use an XKTLoaderPlugin to load an .xkt model. When the model has loaded, we'll hide a couple of Entitys and save a snapshot of the visual states of all the Entitys in an ObjectsMemento. Then we'll show all the Entitys again, and then we'll restore the visual states of all the Entitys again from the ObjectsMemento, which will hide those two Entitys again.

import {Viewer} from "../src/viewer/Viewer.js";
import {ObjectsMemento} from "../src/scene/mementos/ObjectsMemento.js";

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

// Load a model
const xktLoader = new XKTLoaderPlugin(viewer);

const model = xktLoader.load({
    id: "myModel",
    src: "./models/xkt/schependomlaan/schependomlaan.xkt"
});

model.on("loaded", () => {

    // Model has loaded
    // Hide a couple of objects
    viewer.scene.objects["0u4wgLe6n0ABVaiXyikbkA"].visible = false;
    viewer.scene.objects["3u4wgLe3n0AXVaiXyikbYO"].visible = false;

    // Save memento of all object states, which includes those two hidden objects
    const objectsMemento = new ObjectsMemento();

    objectsMemento.saveObjects(viewer.scene);

    // Show all objects
    viewer.scene.setObjectsVisible(viewer.scene.objectIds, true);

    // Restore the objects states again, which involves hiding those two objects again
   objectsMemento.restoreObjects(viewer.scene);
});

Settable CameraControl 3D Pivot Position

So we can do things like automatically pivot about the center of the whole scene:

const aabb = myViewer.scene.getAABB(myViewer.scene.visibleObjectIds);
myViewer.cameraFlight.flyTo({
    aabb: aabb
});
myViewer.cameraControl.pivotPos = math.getAABB3Center(aabb, math.vec3());

NavCube Enhancements

Option for NavCube to view-fit to visible objects only

NavCubePlugin now supports the option to fit the axis, corner and edge-aligned views to visible object-Entitys only.

const navCube = new NavCubePlugin(viewer, {
    canvasID: "myNavCubeCanvas",
    //...
    fitVisible: true  
});

Customizable NavCube Colors

NavCubePlugin now supports custom colors:

 new NavCubePlugin(viewer, {
       
    //...
    // Custom color configurations
    // We can optionally supply a uniform color for the whole cube:
    color: "#99FF99",      // Default value

    // We can also optionally supply a separate color per face,
    // which will override our uniform color, if we supplied that:
    frontColor: "#55FF55", // Default values
    backColor: "#55FF55",
    leftColor: "#FF5555",
    rightColor: "#FF5555",
    topColor: "#5555FF",
    bottomColor: "#5555FF",

    // We can also supply a color to highlight NavCube regions
    // as we hover the pointer over them:
    hoverColor: "rgba(0,0.5,0,0.4)" // Default value
 });

Enable backface culling by default

Backface culling is now enabled by default. This means that triangles that are facing away from the Camera not be rendered, unless we configure it. It also means that you'll your triangle meshes will have holes if their triangles have irregular vertex windings.

Assets 2
Pre-release

@xeolabs xeolabs released this Aug 26, 2019 · 315 commits to master since this release

Overview

This xeokit SDK v0.4.0 beta release contains two new plugins for interactively measuring models, along with the ability to configure units of measurement and the mapping of a "real-world" Cartesian coordinate system to xeokit's World-space coordinate system.

To be properly usable, the measurement tools need the addition of cursor snap-to-line and snap-to-vertex. Those are not in this release, but are planned for the next release. In the meantime, we'll release the measurement tools now in order to get user feedback early.

Distance Measurements

DistanceMeasurementPlugin is a new Viewer plugin for interactively measuring point-to-point distances.

Peek 2019-08-14 20-45

const distanceMeasurements = new DistanceMeasurementsPlugin(viewer);

//--------------------------------------------------------------------
// Create a distance measurement programmatically
//--------------------------------------------------------------------

const myMeasurement1 = distanceMeasurements.createMeasurement({
    id: "distanceMeasurement1",
    origin: {
        entity: viewer.scene.objects["0jf0rYHfX3RAB3bSIRjmoa"],
        worldPos: [0.04815268516540527, 6.0054426193237305, 17.76587677001953]
    },
    target: {
        entity: viewer.scene.objects["2O2Fr$t4X7Zf8NOew3FLOH"],
        worldPos: [4.70150089263916, 3.09493088722229, 17.766956329345703]
    },
    visible: true
});

//--------------------------------------------------------------------
// To create distance measurements interactively 
// with mouse or touch input, activate the plugin's 
// DistanceMeasurementControl
//--------------------------------------------------------------------

distanceMeasurements.control.activate();

Angle Measurements

AngleMeasurementPlugin is a new Viewer plugin for interactively measuring angles.

Peek 2019-08-24 21-28

const angleMeasurements = new AngleMeasurementsPlugin(viewer);

//--------------------------------------------------------------------
// Create an angle measurement programmatically
//--------------------------------------------------------------------

const myMeasurement1 = angleMeasurements.createMeasurement({
    id: "angleMeasurement1",
    origin: {
        entity: viewer.scene.objects["1CZILmCaHETO8tf3SgGEXu"],
        worldPos: [0.41385602951049805,-0.030549049377441406,17.801637649536133]
    },
    corner: {
        entity: viewer.scene.objects["1CZILmCaHETO8tf3SgGEXu"],
        worldPos: [0.4156308174133301, -0.03379631042480469, 22.138973236083984]
    },
    target: {
        entity: viewer.scene.objects["1CZILmCaHETO8tf3SgGEXu"],
        worldPos: [6.181171894073486, -0.0305633544921875,22.141223907470703]
    },
    visible: true
});

//--------------------------------------------------------------------
// To create angle measurements interactively 
// with mouse or touch input, activate the plugin's 
// AngleMeasurementControl
//--------------------------------------------------------------------

angleMeasurements.control.activate();

Units of Measurement

A new Metrics component configures its Scene's measurement unit and mapping between the Real-space and World-space 3D Cartesian coordinate systems. The screen capture below shows how the DistanceMeasurementPlugin will dynamically update its measurements as we update those configurations. Note how the distances and units are changing within the labels.

Peek 2019-08-26 15-24

import {Viewer} from "../src/viewer/Viewer.js";
import {XKTLoaderPlugin} from "../src/plugins/XKTLoaderPlugin/XKTLoaderPlugin.js";

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

//...

const metrics = viewer.scene.metrics;

metrics.units = "meters";
metrics.scale = 10.0;
metrics.origin = [100.0, 0.0, 200.0];
  • 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.
Assets 2
Pre-release

@xeolabs xeolabs released this Jul 9, 2019 · 399 commits to master since this release

Overview

This xeokit SDK v0.3.0 release contains a new plugin for rapidly loading models from an optimized binary format, plus various refinements and fixes as requested by users.

  • Load Models Efficiently using XKTLoaderPlugin
  • Animated Transitions Between Camera Projections
  • Create Annotations using pre-existing DOM Elements
  • Ray Picking
  • BCFViewpointPlugin Enhancements
  • Customizable Loading Spinner
  • Option to use External Canvas for NavCube

Load Models Efficiently using XKTLoaderPlugin

Use the XKTLoaderPlugin to efficiently load models from xeokit's optimized binary .xkt format.

Use the xeokit-gltf-to-xkt tool to convert your glTF files to .xkt format.

The XKTLoaderPlugin and the converter tool are based on prototypes by Toni Marti at uniZite - see the original discussion here.

XKTLoaderPlugin

import {Viewer} from "../src/viewer/Viewer.js";
import {XKTLoaderPlugin} from "../src/plugins/XKTLoaderPlugin/XKTLoaderPlugin.js";

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

const xktLoader = new XKTLoaderPlugin(viewer);

const model = xktLoader.load({ 
   id: "myModel",
   src: "./models/xkt/OTCConferenceCenter/OTCConferenceCenter.xkt",
   metaModelSrc: "./metaModels/OTCConferenceCenter/metaModel.json"
});

Animated Transitions Between Camera Projections

CameraFlightAnimation can now smoothly transition between orthographic and perspective projections.

XKTLoaderPlugin

// Transition to orthographic projection over one second
viewer.cameraFlight.flyTo({ projection: 'ortho', duration: 1.0  })

// Transition back to perspective projection
viewer.cameraFlight.flyTo({ projection: 'ortho', duration: 1.0  })

// Fly Camera to a position, while transitioning to orthographic projection:
viewer.cameraFlight.flyTo({ 
   eye: [-100,20,2],
   look: [0,0,-40],
   up: [0,1,0],
   projection: "ortho", () => {
     // Done
});

Create Annotations using pre-existing DOM Elements

AnnotationsPlugin now gives us the option to supply our own pre-existing HTML elements for the pin and label of each annotation we create.

If we have preexisting DOM elements for an Annotation marker and a label:

<div id="myAnnotation1Marker" ...>A1</div>
<div id="myAnnotation1Label" ...></div>

We can now create an Annotation using the elements:

myAnnotationsPlugin.createAnnotation({
       id: "myAnnotation1",
       //...
       markerElementId: "myAnnotation1Marker",
       labelElementId: "myAnnotation1Label"
});

Ray Picking

We can now pick entities and surface positions using an arbitrarily-positioned ray.

var hit = viewer.scene.pick({
    pickSurface: true,  // This causes picking to find the intersection point on the entity
    origin: [0, 0, 0],      // Fire ray down -Z axis
    direction: [0, 0, -1] 
});

BCFViewpointPlugin Enhancements

BCFViewpointsPlugin now provides a workaround for a xeokit camera compatibility issue with BCF viewpoints, as described below.

xeokit's Camera#look is the current 3D point-of-interest (POI). A BCF viewpoint, however, has a direction vector instead of a POI, and so BCFViewpointsPlugin#getViewpoint saves xeokit's POI as a normalized vector from Camera#eye to Camera#look, which unfortunately loses that positional information. When we load the viewpoint again with BCFViewpointsPlugin#setViewpoint, we're unable to restore Camera#look to the position it had when saving the viewpoint.

BCFViewPointsPlugin now works around this issue as follows. As shown in the code snippet below, providing a rayCast option to setViewpoint will cause the method to set Camera#look to the closest ray/surface intersection found along the Camera's eye -> look vector.

Essentially, when loading a BCF viewpoint, this automatically sets the Camera's POI to the closest thing in front of it. Internally, this uses the new 3D Ray Picking capability mentioned in the previous section.

bcfViewpoints.setViewpoint(viewpoint, {
    rayCast: true // Attempt to set Camera#look to surface intersection point (default)
});

Customizable Loading Spinner

The loading Spinner previously had baked-in HTML and CSS to define its appearance.

This release adds the option to supply the HTML/CSS externally, as an ID of a DOM element provided externally.

const viewer = new Viewer({
    canvasId: "myCanvas",
    spinnerElementId: "mySpinnerElement"
});

Option to use External Canvas for NavCube

This release adds the option to configure NavCubePlugin with an external container canvas, instead of always relying on it to create its own canvas.

new NavCubePlugin(viewer, {
    canvasId: "myNavCubeCanvas"
});
Assets 2
Pre-release

@xeolabs xeolabs released this May 28, 2019 · 476 commits to master since this release

Overview

This xeokit SDK v0.2.0 release contains new plugins for creating section planes, annotating models and navigating the camera, along with model loading enhancements and bug fixes. The core viewer API is now stable, so now development focuses on more plugins for BIM and CAD.

xeokit-v0 2 0

Contents

New Plugins

SectionPlanesPlugin

Use the SectionPlanesPlugin to create and edit SectionPlanes, to slice portions off your models to reveal internal structures.

The SectionPlanesPlugin displays an overview of your SectionPlanes in a separate canvas. Click the planes in the overview canvas to activate a 3D editing control with which you can interactively reposition them in the Viewer canvas.

SectionPlanesPlugin

const sectionPlanes = new SectionPlanesPlugin(viewer, {
    overviewCanvasId: "mySectionPlanesOverviewCanvas",
    overviewVisible: true
});

sectionPlanes.createSectionPlane({
    id: "mySectionPlane",
    pos: [1.04, 1.95, 9.74],
    dir: [1.0, 0.0, 0.0]
});

sectionPlanes.createSectionPlane({
   id: "mySectionPlane2",
   pos: [2.30, 4.46, 14.93],
   dir: [0.0, -0.09, -0.79]
});

const mySectionPlane2 = sectionPlanes.sectionPlanes["mySectionPlane2"];

mySectionPlane2.pos = [11.0, 6.-, -12];
mySectionPlane2.dir = [0.4, 0.0, 0.5];

AnnotationsPlugin

Use the AnnotationsPlugin to pin Annotations on your models. Annotations are fully customizable with HTML templates, can be dynamically updated with data, and can automatically hide themselves when occluded. Optionally associate each Annotation with a camera position to fly to.

Peek 2019-05-27 09-29

const annotations = new AnnotationsPlugin(viewer, {
    markerHTML: "<div class='annotation-marker' style='background-color:\
        {{markerBGColor}};'>{{glyph}}</div>",
    labelHTML: "<div class='annotation-label' style='background-color:\
        {{labelBGColor}};'><div class='annotation-title'>{{title}}</div>\
        <div class='annotation-desc'>{{description}}</div></div>",
    values: {
        markerBGColor: "red",
        labelBGColor: "white",
        glyph: "X",
        title: "Untitled",
        description: "No description"
    }
});

annotations.createAnnotation({
    id: "myAnnotation1",
    entity: viewer.scene.objects["2O2Fr$t4X7Zf8NOew3FLOH"],
    worldPos: [2.039, 4.418, 17.965],
    occludable: true,
    markerShown: true,
    labelShown: false,
    values: {
        glyph: "A1",
        title: "Front wall",
        description: "This is the front wall",
        markerBGColor: "green"
    }
});

NavCubePlugin

Use the NavCubePlugin to position the camera to look at your models along the coordinate axii and diagonals, to easily obtain axis-aligned and isometric views. Rotate the NavCube to orbit the camera. Orbit the camera and see the NavCube rotate in synch.

Peek 2019-04-06 21-48

const navCube = new NavCubePlugin(viewer, {
    canvasID: "myNavCubeCanvas",
    visible: true,                // Initially visible 
    size: 250,                    // NavCube size in pixels
    alignment: "topRight", // Align NavCube to top-right 
    topMargin: 170,           // 170 pixels margin from top
    cameraFly: true,          // Fly camera to each axis/diagonal
    cameraFitFOV: 45,     // How tightly camera fits 
    cameraFlyDuration: 0.5 // How long camera takes to fly 
});

PlanViewsPlugin

PlanViewsPlugin is an experimental plugin that automatically generates plan view bitmaps from IfcStorey elements within BIM models. So far this just generates the bitmaps, with no interactivity. We'll work that out from user feedback.

Screenshot from 2019-04-06 23-30-08

const planViews = new PlanViewsPlugin(viewer, {
     size: [220, 220],
     format: "png",  
     ortho: true    
});

model.on("loaded", function () {
     const planViewIds = Object.keys(planViews.planViews);
     for (var i = 0, len = planViewIds.length; i < len; i++) {
         const planViewId       = planViewIds[i];
         const planView          = planViews.planViews[planViewId];
         const aabb                 = planView.aabb; // Boundary of storey elements
         const modelId            = planView.modelId; // "myModel"
         const storeyObjectId  = planView.storeyObjectId; // ID of IfcBuildingStorey
         const snapshotData   = planView.snapshotData;
         //...
     }
});

Enhancements

Streamed Loading Support

xeokit's high-performance model representation now supports incremental loading, which allows users to interact with models while they load.

This capability is supported through the addition of tiles to the PerformanceModel component, which can partition a model into tiles, allowing users to interact with each tile as soon as it's loaded, while loading other tiles in the background.

This capability was initially introduced to support the development of a proprietary loader for a client, which streams content into a xeokit viewer through a WebSocket.

Incremental glTF Loading

GLTFLoaderPlugin can use the PerformanceModel tiles (see previous item) to load glTF models incrementally, while the user interacts with them.

Prioritized glTF BIM Loading

GLTFLoaderPlugin can now prioritize loading of objects based on their IFC types, while at the same time allowing the user to interact with the model as it loads.

GLTFLoaderPlugin achieves this using the PerformanceModel's new "tiles" feature (see previous item), loading the most interesting IFC types in one tile, loading next-most-interesting types in the next tile, and so on.

The screen capture below shows how we can load visually-important elements like "IfcWall", "IfcFloor" and "IfcRoof" first, so that the user has those to interact with while we load less visually-important elements like "IfcDuctSegment", "IfcAirFlowTerminal", and so on.

prioritizedLoading

Configuring a Custom glTF Data Source

GLTFLoaderPlugin can now be configured with a custom data source object, enabling us to customize the way it loads glTF, binary attachments and JSON IFC metadata.

This was requested by two clients who are each embedding a xeokit Viewer in a C# runtime, which manages the persistence of the file data.

3D Picking for High Performance Models

xeokit now supports 3D picking of entities within its high performance model representation. This was already supported for entities in the the standard scene graph representation, but required its own special algorithms to work with the huge models rendered by the high-performance representation.

Assets 2
Pre-release

@xeolabs xeolabs released this Mar 9, 2019 · 627 commits to master since this release

  • Fixes geometry quantization error rendering large models with low geometry reuse - #32
Assets 2
Pre-release

@xeolabs xeolabs released this Mar 6, 2019 · 638 commits to master since this release

  • Fixes error preventing multiple PerformanceModels to be created concurrently - #27
Assets 2
Pre-release

@xeolabs xeolabs released this Mar 6, 2019 · 639 commits to master since this release

  • Fixes missing objects with GLTFLoaderPlugin - #23
  • Fixes unpickable objects with PerformanceModel - #26
  • Fixes PerformanceModel not able to show edges and colorize colors on individual objects - #17
Assets 2
Pre-release
  • v0.1.4
  • 39fc9d4
  • Compare
    Choose a tag to compare
    Search for a tag
  • v0.1.4
  • 39fc9d4
  • Compare
    Choose a tag to compare
    Search for a tag

@xeolabs xeolabs released this Feb 18, 2019 · 682 commits to master since this release

  • Implemented colorize and pickable properties for PerformanceModel
Assets 2

@xeolabs xeolabs released this Feb 7, 2019 · 691 commits to master since this release

Enough functionality to get started building apps on the xeokit-sdk.

Assets 2
Feb 6, 2019
Comments tweak
You can’t perform that action at this time.