Reference Source
public class | source

SectionPlanesPlugin

Extends:

Plugin → SectionPlanesPlugin

SectionPlanesPlugin is a Viewer plugin that manages SectionPlanes.

[Run this example]

Overview

  • Use the SectionPlanesPlugin to create and edit SectionPlanes to slice portions off your models and reveal internal structures.
  • As shown in the screen capture above, SectionPlanesPlugin shows an overview of all your SectionPlanes (on the right, in this example).
  • Click a plane in the overview to activate a 3D control with which you can interactively reposition its SectionPlane in the main canvas.
  • Use {@lin BCFViewpointsPlugin} to save and load SectionPlanes in BCF viewpoints.

Usage

In the example below, we'll use a GLTFLoaderPlugin to load a model, and a SectionPlanesPlugin to slice it open with two SectionPlanes. We'll show the overview in the bottom right of the Viewer canvas. Finally, we'll programmatically activate the 3D editing control, so that we can use it to interactively reposition our second SectionPlane.

import {Viewer, GLTFLoaderPlugin, SectionPlanesPlugin} from "xeokit-sdk.es.js";

// Create a Viewer and arrange its Camera

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

viewer.camera.eye = [-5.02, 2.22, 15.09];
viewer.camera.look = [4.97, 2.79, 9.89];
viewer.camera.up = [-0.05, 0.99, 0.02];


// Add a GLTFLoaderPlugin

const gltfLoader = new GLTFLoaderPlugin(viewer);

// Add a SectionPlanesPlugin, with overview visible

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

// Load a model

const model = gltfLoader.load({
    id: "myModel",
    src: "./models/gltf/schependomlaan/scene.gltf"
});

// Create a couple of section planes
// These will be shown in the overview

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]
});

// Show the SectionPlanePlugin's 3D editing gizmo,
// to interactively reposition one of our SectionPlanes

sectionPlanes.showControl("mySectionPlane2");

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

// Programmatically reposition one of our SectionPlanes
// This also updates its position as shown in the overview gizmo

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

Constructor Summary

Public Constructor
public

constructor(viewer: Viewer, cfg: Object)

Member Summary

Public Members
public get

sectionPlanes: {String: SectionPlane}: *

Returns a map of the SectionPlanes created by this SectionPlanesPlugin.

Method Summary

Public Methods
public

clear()

Destroys all SectionPlanes created by this SectionPlanesPlugin.

public

Creates a SectionPlane.

public

Destroys this SectionPlanesPlugin.

public

Destroys a SectionPlane created by this SectionPlanesPlugin.

public

Inverts the direction of SectionPlane#dir on every existing SectionPlane.

public

Gets if the overview canvas is visible.

public

Gets the ID of the SectionPlane that the 3D editing gizmo is shown for.

public

Hides the 3D SectionPlane editing gizmo if shown.

public

Sets if the overview canvas is visible.

public

Shows the 3D editing gizmo for a SectionPlane.

Inherited Summary

From class Plugin
public

ID for this Plugin, unique within its Viewer.

public

The Viewer that contains this Plugin.

public

Destroys this Plugin and removes it from its Viewer.

public

error(msg: String)

Logs an error message to the JavaScript developer console, prefixed with the ID of this Plugin.

public

fire(event: String, value: Object, forget: Boolean)

Fires an event on this Plugin.

public

Returns true if there are any subscribers to the given event on this Plugin.

public

log(msg: String)

Logs a message to the JavaScript developer console, prefixed with the ID of this Plugin.

public

off(subId: String)

Cancels an event subscription that was previously made with Plugin#on or Plugin#once.

public

on(event: String, callback: Function, scope: Object): String

Subscribes to an event on this Plugin.

public

once(event: String, callback: Function, scope: Object)

Subscribes to the next occurrence of the given event, then un-subscribes as soon as the event is subIdd.

public

scheduleTask(task: *)

Schedule a task to perform on the next browser interval

public

warn(msg: String)

Logs a warning message to the JavaScript developer console, prefixed with the ID of this Plugin.

Public Constructors

public constructor(viewer: Viewer, cfg: Object) source

Creates this Plugin and installs it into the given Viewer.

Override:

Plugin#constructor

Params:

NameTypeAttributeDescription
viewer Viewer

The Viewer.

cfg Object

Plugin configuration.

cfg.id String
  • optional
  • default: "SectionPlanes"

Optional ID for this plugin, so that we can find it within Viewer#plugins.

cfg.overviewCanvasId String
  • optional

ID of a canvas element to display the overview.

cfg.overviewVisible String
  • optional
  • default: true

Initial visibility of the overview canvas.

Public Members

public get sectionPlanes: {String: SectionPlane}: * source

Returns a map of the SectionPlanes created by this SectionPlanesPlugin.

Return:

{String: SectionPlane}

A map containing the SectionPlanes, each mapped to its SectionPlane#id.

Public Methods

public clear() source

Destroys all SectionPlanes created by this SectionPlanesPlugin.

public createSectionPlane(params: Object): SectionPlane source

Creates a SectionPlane.

The SectionPlane will be registered by SectionPlane#id in SectionPlanesPlugin#sectionPlanes.

Params:

NameTypeAttributeDescription
params Object

SectionPlane configuration.

params.id String
  • optional

Unique ID to assign to the SectionPlane. Must be unique among all components in the Viewer's Scene. Auto-generated when omitted.

params.pos Number[]
  • optional
  • default: [0,0,0]

World-space position of the SectionPlane.

params.dir Number[]
  • optional
  • default: [0,0,-1]

World-space vector indicating the orientation of the SectionPlane.

params.active Boolean
  • optional
  • default: true

Whether the SectionPlane is initially active. Only clips while this is true.

Return:

SectionPlane

The new SectionPlane.

public destroy() source

Destroys this SectionPlanesPlugin.

Also destroys each SectionPlane created by this SectionPlanesPlugin.

Does not destroy the canvas the SectionPlanesPlugin was configured with.

Override:

Plugin#destroy

public destroySectionPlane(id: String) source

Destroys a SectionPlane created by this SectionPlanesPlugin.

Params:

NameTypeAttributeDescription
id String

ID of the SectionPlane.

public flipSectionPlanes() source

Inverts the direction of SectionPlane#dir on every existing SectionPlane.

Inverts all SectionPlanes, including those that were not created with SectionPlanesPlugin.

public getOverviewVisible(): Boolean source

Gets if the overview canvas is visible.

Return:

Boolean

True when the overview canvas is visible.

public getShownControl(): String source

Gets the ID of the SectionPlane that the 3D editing gizmo is shown for.

Returns null when the editing gizmo is not shown.

Return:

String

ID of the the SectionPlane that the 3D editing gizmo is shown for, if shown, else null.

public hideControl() source

Hides the 3D SectionPlane editing gizmo if shown.

public setOverviewVisible(visible: Boolean) source

Sets if the overview canvas is visible.

Params:

NameTypeAttributeDescription
visible Boolean

Whether or not the overview canvas is visible.

public showControl(id: String) source

Shows the 3D editing gizmo for a SectionPlane.

Params:

NameTypeAttributeDescription
id String

ID of the SectionPlane.