API Docs for:

STLModel

An STLModel is a Model that's loaded from an STL file.

Overview

  • An STL (“StereoLithography”) file is a triangular representation of a 3-dimensional surface geometry. The surface is tessellated logically into a series of triangles. Each facet is described by a perpendicular direction and three points representing the vertices (corners) of the triangle.
  • An STLModel is a container of Components that loads itself from an STL file.
  • It begins loading as soon as you set its src property to the location of a valid STL file.
  • You can set src to a new file path at any time, which causes the STLModel to clear itself and load components from the new file.
  • For binary STL, has the option to create a separate Mesh for each group of faces that share the same vertex colors. This allows us to treat STL models as parts assemblies.
  • Can be configured to automatically smooth STL models by converting their face-oriented normals to vertex-oriented.

STLModel inherits these capabilities from its Group base class:

  • Allows you to access and manipulate the Meshes within it.
  • Can be transformed as a unit within World-space.
  • Can be a child within a parent Group.
  • Provides its World-space axis-aligned and object-aligned boundaries.

Examples

Usage

Loading STL

Load an STL file by creating an STLModel:

var model = new xeogl.STLModel({
    id: "myModel",
    src: "models/stl/F1Concept.stl",

    // Some example loading options (see "Options" below)
    smoothNormals: true,
    smoothNormalsAngleThreshold: 45
});

An STLModel prefixes its own ID to those of its components. The ID is optional, but in this example we're providing our own custom ID.

The STLModel begins loading the STL file immediately.

To bind a callback to be notified when the file has loaded (which fires immediately if already loaded):

model.on("loaded", function() {
       // STLModel has loaded!
   });

You can also bind a callback to fire if loading fails:

model.on("error", function(msg) {
       // Error occurred
   });

To switch to a different STL file, you can dynamically update src:

model.src = "models/stl/F1Concept.stl"

That will apply whatever options were specified to the constructor.

Parsing STL

If we have STL data in memory, then we can parse it directly into an existing STLModel instance using the static parse method:

xeogl.STLModel.parse(model, stlData, {

   // Some example parsing options (see "Options" below)
    smoothNormals: true,
    smoothNormalsAngleThreshold: 45,
    combineGeometry: true,
    quantizeGeometry: true
});

That's asynchronous because STL is self-contained and does not need to load any external assets.

Options

The following options may be specified when loading or parsing STL:

Option Type Range Default Value Description
quantizeGeometry Boolean true When true, quantizes geometry to reduce memory and GPU bus usage (see Geometry).
combineGeometry Boolean true When true, internally combines geometry vertex buffers to improve rendering performance (see Geometry).
smoothNormals Boolean false When true, automatically converts face-oriented normals to vertex normals for a smooth appearance. See Smoothing Normals.
smoothNormalsAngleThreshold Number (degrees) [0..180] 20 See Smoothing Normals.
backfaces Boolean true When true, allows visible backfaces, wherever specified in the STL. When false, ignores backfaces.
ghosted Boolean false When true, ghosts all the model's Meshes (see Mesh and EmphasisMaterial).
outlined Boolean false When true, outlines all the model's Meshes (see Mesh and OutlineMaterial).
highlighted Boolean false When true, highlights all the model's Meshes (see Mesh and EmphasisMaterial).
selected Boolean false When true, renders all the model's Meshes as selected (see Mesh and EmphasisMaterial).
edges Boolean false When true, emphasizes the edges on all the model's Meshes (see Mesh and EdgeMaterial).
edgeThreshold Number [0..180] 2 When ghosting, this is the threshold angle between normals of adjacent triangles, below which their shared wireframe edge is not drawn.
splitMeshes Boolean true When true, creates a separate Mesh for each group of faces that share the same vertex colors. Only works with binary STL.

Smoothing Normals

As mentioned above, providing a smoothNormals flag to the constructor gives our STLModel a smooth appearance. Triangles in STL are disjoint, where each triangle has its own separate vertex positions, normals and (optionally) colors. This means that you can have gaps between triangles. Normals for each triangle are perpendicular to the triangle's surface, which gives the model a faceted appearance by default.

The smoothNormals flag causes the STLModel to recalculate its normals, so that each normal's direction is the average of the orientations of the triangles adjacent to its vertex. When smoothing, each vertex normal is set to the average of the orientations of all other triangles that have a vertex at the same position, excluding those triangles whose direction deviates from the direction of the vertice's triangle by a threshold given in smoothNormalsAngleThreshold. This makes smoothing robust for hard edges, which you can see on the cylindrical objects in one of the examples:

Note how the rim is smooth, yet the there is still a sharp edge adjacent to the flat portions.

Finding STLModels in Scenes

Our STLModel will now be registered by ID on its Scene, so we can now find it like this:

var scene = xeogl.getDefaultScene();
model = scene.models["myModel"];

That's assuming that we've created the STLModel in the default xeogl Scene, which we're doing in these examples.

We can also get all the STLModels in a Scene, using the Scene's types map:

var scene = xeogl.getDefaultScene();
var stlModels = scene.types["xeogl.STLModel"];

model = stlModels["myModel"];

Finding loaded Meshes

Once the STLModel has loaded, its Scene will contain various components that represent the elements of the STL file. We'll now access some of those components by ID, to query and update them programmatically.

Let's highlight an Object in our STLModel:

scene.omponents["myModel#1"].highlighted = true;

An STLModel also has an ID map of the components within it. Let's highlight another Object via the STLModel:

model.components["myModel#2"].highlighted = true;

An STLModel also has a map containing just the Objects:

model.objects["myModel#3"].highlighted = true;

TODO: ID format description

Transforming an STLModel

An STLModel lets us transform its Meshes as a group:

var model = new xeogl.STLModel({
    src: "models/stl/F1Concept.stl",
    position: [-35, 0, 0],
    rotation: [0, 45, 0],
    scale: [0.5, 0.5, 0.5]
});

model.position = [-20, 0, 0];

Getting the World-space boundary of an STLModel

Get the World-space axis-aligned boundary like this:

model.on("boundary", function() {
   var aabb = model.aabb; //  [xmin, ymin,zmin,xmax,ymax, zmax]
   //...
});

We can also subscribe to changes to that boundary, which will happen whenever

  • the STLModel's Transform is updated,
  • components are added or removed, or
  • the STLModel is reloaded from a different source,
  • the Geometries or Transform of its Meshes are updated.
model.on("boundary", function() {
   var aabb = model.aabb; // [xmin, ymin,zmin,xmax,ymax, zmax]
});

Clearing an STLModel

model.clear();

Destroying an STLModel

model.destroy();

Constructor

STLModel

(
  • [scene]
  • [cfg]
)

Parameters:

  • [scene] Scene optional

    Parent Scene - creates this STLModel in the default Scene when omitted.

  • [cfg] optional

    Configs

    • [id] String optional

      Optional ID, unique among all components in the parent Scene, generated automatically when omitted.

    • [entityType] String optional

      Optional entity classification when using within a semantic data model. See the Object documentation for usage.

    • [meta] String:Object optional

      Optional map of user-defined metadata to attach to this STLModel.

    • [src] String optional

      Path to an STL file. You can set this to a new file path at any time, which will cause the

    • [quantizeGeometry=true] Boolean optional

      When true, quantizes geometry to reduce memory and GPU bus usage.

    • [combineGeometry=true] Boolean optional

      When true, combines geometry vertex buffers to improve rendering performance.

    • [smoothNormals=false] Boolean optional

      When true, automatically converts face-oriented normals to vertex normals for a smooth appearance - see Smoothing Normals.

    • [smoothNormalsAngleThreshold=20] Number optional
    • [backfaces=false] Boolean optional

      When true, allows visible backfaces, wherever specified in the STL. When false, ignores backfaces.

    • [ghosted=false] Boolean optional

      When true, sets all the Model's Meshes initially ghosted.

    • [highlighted=false] Boolean optional

      When true, sets all the Model's Meshes initially highlighted.

    • [outline=false] Boolean optional

      When true, sets all the Model's Meshes initially outlined.

    • [edgeThreshold=2] Number optional

      When ghosting, this is the threshold angle between normals of adjacent triangles, below which their shared wireframe edge is not drawn.

    • [transform] Number | String | Transform optional

      A Local-to-World-space (modelling) Transform to attach to this STLModel. Must be within the same Scene as this STLModel. Internally, the given Transform will be inserted above each top-most Transform that the STLModel attaches to its Meshes.

    • [splitMeshes=true] Boolean optional

      When true, creates a separate Mesh for each group of faces that share the same vertex colors. Only works with binary STL.|

    • [position=[0,0,0] Float32Array optional

      The STLModel's local 3D position.

    • [scale=[1,1,1] Float32Array optional

      The STLModel's local scale.

    • [rotation=[0,0,0] Float32Array optional

      The STLModel's local rotation, as Euler angles given in degrees.

    • [matrix=[1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1] Float32Array optional

      The STLModel's local transform matrix. Overrides the position, scale and rotation parameters.

Methods

angleVec3

(
  • v
  • w
)
Number

Gets the angle between two vectors

Parameters:

Returns:

Number:

clear

()

Destroys all Components in this Model.

create

(
  • [cfg]
)

Convenience method for creating a Component within this Component's Scene.

The method is given a component configuration, like so:

var material = myComponent.create({
     type: "xeogl.PhongMaterial",
     diffuse: [1,0,0],
     specular: [1,1,0]
}, "myMaterial");

Parameters:

  • [cfg] optional

    Configuration for the component instance.

Returns:

:

destroy

()

Destroys this component.

Fires a destroyed event on this Component.

Automatically disassociates this component from other components, causing them to fall back on any defaults that this component overrode on them.

TODO: describe effect with respect to #create

error

(
  • message
)

Logs an error for this component to the JavaScript console.

The console message will have this format: [ERROR] [<component type> =<component id>: <message>

Also fires the message as an error event on the parent Scene.

Parameters:

  • message String

    The message to log

fire

(
  • event
  • value
  • [forget=false]
)

Fires an event on this component.

Notifies existing subscribers to the event, optionally retains the event to give to any subsequent notifications on the event as they are made.

Parameters:

  • event String

    The event type name

  • value Object

    The event parameters

  • [forget=false] Boolean optional

    When true, does not retain for subsequent subscribers

hasSubs

(
  • event
)
Boolean

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

Parameters:

  • event String

    The event

Returns:

Boolean:

True if there are any subscribers to the given event on this component.

isType

(
  • type
)
Boolean

Tests if this component is of the given type, or is a subclass of the given type.

The type may be given as either a string or a component constructor.

This method works by walking up the inheritance type chain, which this component provides in property Component/superTypes:property, returning true as soon as one of the type strings in the chain matches the given type, of false if none match.

Examples:

var myRotate = new xeogl.Rotate({ ... });

myRotate.isType(xeogl.Component); // Returns true for all xeogl components
myRotate.isType("xeogl.Component"); // Returns true for all xeogl components
myRotate.isType(xeogl.Rotate); // Returns true
myRotate.isType(xeogl.Transform); // Returns true
myRotate.isType("xeogl.Transform"); // Returns true
myRotate.isType(xeogl.Mesh); // Returns false, because xeogl.Rotate does not (even indirectly) extend xeogl.Mesh

Parameters:

  • type String | Function

    Component type to compare with, eg "xeogl.PhongMaterial", or a xeogl component constructor.

Returns:

Boolean:

True if this component is of given type or is subclass of the given type.

load

(
  • model
  • src
  • options
  • [ok]
  • [error]
)
static

Loads STL from a URL into a Model.

Parameters:

  • model Model

    Model to load into.

  • src String

    Path to STL file.

  • options Object

    Loading options.

  • [ok] Function optional

    Completion callback.

  • [error] Function optional

    Error callback.

log

(
  • message
)

Logs a console debugging message for this component.

The console message will have this format: [LOG] [<component type> <component id>: <message>

Also fires the message as a log event on the parent Scene.

Parameters:

  • message String

    The message to log

lookAtMat4v

(
  • pos
  • target
  • up
  • dest
)
Mat4

Returns a 4x4 'lookat' viewing transform matrix.

Parameters:

  • pos Object

    vec3 position of the viewer

  • target Object

    vec3 point the viewer is looking at

  • up Object

    vec3 pointing "up"

  • dest Object

    mat4 Optional, mat4 matrix will be written into

Returns:

Mat4:

dest if specified, a new mat4 otherwise

off

(
  • subId
)

Cancels an event subscription that was previously made with Component#on() or Component#once().

Parameters:

  • subId String

    Publication subId

on

(
  • event
  • callback
  • [scope=this]
)
String

Subscribes to an event on this component.

The callback is be called with this component as scope.

Parameters:

  • event String

    The event

  • callback Function

    Called fired on the event

  • [scope=this] Object optional

    Scope for the callback

Returns:

String:

Handle to the subscription, which may be used to unsubscribe with {@link #off}.

once

(
  • event
  • callback
  • [scope=this]
)

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

This is equivalent to calling Component#on(), and then calling Component#off() inside the callback function.

Parameters:

  • event String

    Data event to listen to

  • callback Function(data)

    Called when fresh data is available at the event

  • [scope=this] Object optional

    Scope for the callback

parse

(
  • model
  • data
  • [options]
)
static

Parses STL into a Model.

Parameters:

  • model Model

    Model to parse into.

  • data ArrayBuffer

    The STL data.

  • [options] Object optional

    Parsing options

    • [basePath] String optional

      Base path path to find external resources on, if any.

    • [loadBuffer] String optional

      Callback to load buffer files.

removeChild

(
  • object
)

Removes the given child.

Parameters:

  • object Object

    Child to remove.

removeChildren

()

Removes all children.

rotate

(
  • angle
)

Rotates about the given local axis by the given increment.

Parameters:

  • angle Number

    Angle increment in degrees.

rotateX

(
  • angle
)

Rotates about the local X-axis by the given increment.

Parameters:

  • angle Number

    Angle increment in degrees.

rotateY

(
  • angle
)

Rotates about the local Y-axis by the given increment.

Parameters:

  • angle Number

    Angle increment in degrees.

rotateZ

(
  • angle
)

Rotates about the local Z-axis by the given increment.

Parameters:

  • angle Number

    Angle increment in degrees.

scaleMat4c

(
  • x
  • y
  • z
  • m
)

Efficiently post-concatenates a scaling to the given matrix.

Parameters:

translate

(
  • axis
  • distance
)

Translates along local space vector by the given increment.

Parameters:

  • axis Float32Array

    Normalized local space 3D vector along which to translate.

  • distance Number

    Distance to translate along the vector.

translateX

(
  • distance
)

Translates along the local X-axis by the given increment.

Parameters:

  • distance Number

    Distance to translate along the X-axis.

warn

(
  • message
)

Logs a warning for this component to the JavaScript console.

The console message will have this format: [WARN] [<component type> =<component id>: <message>

Also fires the message as a warn event on the parent Scene.

Parameters:

  • message String

    The message to log

Properties

aabb

Float32Array final

World-space 3D axis-aligned bounding box (AABB).

Represented by a six-element Float32Array containing the min/max extents of the axis-aligned volume, ie. [xmin, ymin,zmin,xmax,ymax, zmax].

aabbVisible

Boolean

Indicates if the 3D World-space axis-aligned bounding box (AABB) is visible.

Default: false

castShadow

Boolean

Indicates if casting shadows.

Default: true

center

Float32Array final

World-space 3D center.

childIDs

Array final

IDs of child Objects.

childMap

final

Child Objects mapped to their IDs.

children

Array final

Array of child Objects.

clippable

Boolean

Indicates if clippable.

Clipping is done by the Scene's Clips component.

Default: true

collidable

Boolean

Indicates if included in boundary calculations.

Default: true

colorize

Float32Array

RGB colorize color, multiplies by the rendered fragment color.

Default: [1.0, 1.0, 1.0]

components

String:Component

All contained Components, mapped to their IDs.

culled

Boolean

Indicates if culled from view.

Only rendered when visible is true and culled is false.

Default: false

DEGTORAD

Number

The number of radiians in a degree (0.0174532925).

destroyed

Boolean

True as soon as this Component has been destroyed

edges

Boolean

Indicates if edges are emphasized.

Default: false

entities

String:Object final

Objects in this Model that have entity types, mapped to their IDs.

Each Object is registered in this map when its entityType is set to value.

entityIds

Array of String final

Convenience array of IDs in entities.

entityType

String final

Optional entity classification when using within a semantic data model.

See the Object documentation on "Applying a semantic data model" for usage.

Default: null

entityTypeIds

Array of String final

Convenience array of entity type IDs in entityTypes.

entityTypes

String:{String:xeogl.Component} final

For each entity type, a map of IDs to Objects of that entity type.

Each Object is registered in this map when its entityType is assigned a value.

ghosted

Boolean

Indicates if ghosted.

Each ghosted Object is registered in its Scene's ghostedEntities map while its entityType is set to a value.

Default: false

guid

String final

Globally unique identifier.

This is unique not only within the Scene, but throughout the entire universe.

Only defined when given to the constructor.

guidObjects

String:Object final

Objects in this Model that have GUIDs, mapped to their GUIDs.

Each Object is registered in this map when its guid is assigned a value.

highlighted

Boolean

Indicates if highlighted.

Each highlighted Object is registered in its Scene's highlightedEntities map while its entityType is set to a value.

Default: false

id

String final

Unique ID for this Component within its parent Scene.

matrix

Float32Array

Local matrix.

Default: [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1]

meshes

String:xeogl.Mesh final

All contained Meshes, mapped to their IDs.

metadata

Object

Arbitrary, user-defined metadata on this component.

model

Model final

The Model which contains this Component, if any.

Will be null if this Component is not in a Model.

numChildren

Number final

Number of child Objects.

numComponents

Number

Number of contained Components.

objects

String:Object final

All contained Objects, mapped to their IDs.

opacity

Number

Opacity factor, multiplies by the rendered fragment alpha.

This is a factor in range [0..1].

Default: 1.0

outlined

Boolean

Indicates if outlined.

Default: false

parent

Group

The parent.

The parent Group may also be set by passing the Object to the Group/Model's Group/addChild:method method.

pickable

Boolean

Whether or not to allow picking.

Picking is done via calls to Scene#pick().

Default: true

position

Float32Array

Local translation.

Default: [0,0,0]

quaternion

Float32Array

Local rotation quaternion.

Default: [0,0,0, 1]

RADTODEG

Number

The number of degrees in a radian.

receiveShadow

Boolean

Indicates if receiving shadows.

Default: true

rotation

Float32Array

Local rotation, as Euler angles given in degrees, for each of the X, Y and Z axis.

Default: [0,0,0]

scale

Float32Array

Local scale.

Default: [1,1,1]

scene

Scene final

The parent Scene that contains this Component.

selected

Boolean

Indicates if selected.

Each selected Object is registered in its Scene's selectedEntities map while its entityType is set to a value.

Default: false

src

String

Path to an STL file.

You can set this to a new file path at any time (except while loading), which will cause the STLModel to load components from the new file (after first destroying any components loaded from a previous file path).

Fires a loaded event when the STL has loaded.

type

String final

JavaScript class name for this Component.

For example: "xeogl.AmbientLight", "xeogl.MetallicMaterial" etc.

types

String:{String:xeogl.Component}

A map of maps; for each contained Component type, a map to IDs to Component instances, eg.

"xeogl.Geometry": {
       "alpha": <xeogl.Geometry>,
       "beta": <xeogl.Geometry>
     },
"xeogl.Rotate": {
       "charlie": <xeogl.Rotate>,
       "delta": <xeogl.Rotate>,
       "echo": <xeogl.Rotate>,
     },
//...

visible

Boolean

Indicates if visible.

Only rendered when visible is true and culled is false.

Each visible Object is registered in its Scene's visibleEntities map while its entityType is set to a value.

Default: true

worldMatrix

Float32Array

The World matrix.

worldNormalMatrix

Float32Array

This World normal matrix.

Default: [1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1]

Events

destroyed

Fired when this Component is destroyed.

error

Fired whenever this STLModel fails to load the STL file specified by src.

Event Payload:

  • msg String

    Description of the error

loaded

Fired whenever this STLModel has finished loading components from the STL file specified by src.