API Docs for: 0.8.0

Mesh

Extends Object
Defined in: src/objects/mesh.js:1
Module: objects
Parent Module: xeogl

A Mesh is an Object that represents a drawable 3D primitive.

Overview

  • A Mesh represents a WebGL draw call.
  • Each Mesh has six components: Geometry for shape, Material for normal rendered appearance, three EmphasisMaterials for ghosted, highlighted and selected effects, and EdgeMaterial for rendering emphasised edges.
  • By default, Meshes in the same Scene share the same global scene flyweight instances of those components among themselves. The default component instances are provided by the Scene's geometry, material, ghostMaterial, highlightMaterial, selectedMaterial and edgeMaterial properties.
  • A Mesh with all defaults is a white unit-sized box centered at the World-space origin.
  • Customize your Meshes by attaching your own instances of those component types, to override the defaults as needed.
  • For best performance, reuse as many of the same component instances among your Meshes as possible.
  • Use Group components to organize Meshes into hierarchies, if required.

This page covers functionality specific to the Mesh component, while Object covers generic functionality inherited from the base class.

Usage

Creating a Mesh

Creating a minimal Mesh that has all the default components:

var mesh = new xeogl.Mesh(); // A white unit-sized box centered at the World-space origin

Since our Mesh has all the default components, we can get those off either the Mesh or its Scene:

mesh.material.diffuse = [1.0, 0.0, 0.0];           // This is the same Material component...
mesh.scene.material.diffuse  = [1.0, 0.0, 0.0];    // ...as this one.

In practice, we would provide (at least) our own Geometry and Material for the Mesh:

var mesh = new xeogl.Mesh({
    geometry: new xeogl.TeapotGeometry(),
    material: new xeogl.MetallicMaterial({
        baseColor: [1.0, 1.0, 1.0]
    })
});

Creating hierarchies

In xeogl we represent an object hierarchy as a tree of Objects in which the leaf Objects are Meshes. In an Object tree, an operation on an Object is recursively applied to sub-Objects, down to the Meshes at the leaves.

See Object for information on organizing Meshes hierarchically.

Controlling visibility

Show or hide a Mesh by setting its visible property:

mesh.visible = false; // Hide
mesh.visible = true; // Show (default)

This property is inherited from Object.

Controlling clipping

By default, a Mesh will be clipped by the Scene's clipping planes.

Make a Mesh unclippable by setting its clippable property false:

mesh.clippable = false; // Default is true

Controlling rendering order

Control the order in which a Mesh is rendered relative to others by setting its layer property. You would normally do this when you need to ensure that transparent Meshes are rendered in back-to-front order for correct alpha blending.

Assigning our Mesh to layer 0 (all Meshes are in layer 0 by default):

mesh.layer = 0;

Create another Mesh in a higher layer, that will get rendered after layer 0:

var mesh2 = new xeogl.Mesh({
    geometry: new xeogl.Sphere(),
    layer: 1
});

Geometry

A Mesh has a Geometry which describes its shape. When we don't provide a Geometry, a Mesh will automatically get its Scene's geometry by default.

Creating a Mesh with its own Geometry:

var mesh = new xeogl.Mesh({
    geometry: new xeogl.TeapotGeometry()
});

Getting geometry arrays:

ver geometry = mesh.geometry;

var primitive = geometry.primitive;        // Default is "triangles"
var positions = geometry.positions;        // Local-space vertex positions
var normals = geometry.normals;            // Local-space vertex Normals
var uv = geometry.uv;                      // UV coordinates
var indices = mesh.geometry.indices;     // Vertex indices for pimitives

The Mesh also has a convenience property which provides the vertex positions in World-space, ie. after they have been transformed by the Mesh's worldMatrix:

// These are internally generated on-demand and cached. To free the cached
// vertex World positions when you're done with them, set this property to null or undefined
var worldPositions = mesh.worldPositions;

Material

A Mesh has a Material, which describes its appearance. When we don't provide it with a Material, it will automatically get its Scene's material by default.

Creating a Mesh with its own custom Geometry and MetallicMaterial:

var mesh = new xeogl.Mesh({
    geometry: new xeogl.TeapotGeometry(),
    material: new xeogl.MetallicMaterial({
        baseColor: [0.0, 0.0, 1.0],
        metallic: 1.0,
        roughness: 1.0,
        emissive: [0.0, 0.0, 0.0],
        alpha: 1.0
    })
});

Animating the MetallicMaterial's diffuse color - making the Mesh rapidly pulse red:

mesh.scene.on("tick", function(e) {
   var t = e.time - e.startTime; // Millisecs
   mesh.material.baseColor = [0.5 + Math.sin(t * 0.01), 0.0, 0.0]; // RGB
});

Transforming

A Mesh can be positioned within the World-space coordinate system.

See Object.

Ghosting

Ghost a Mesh by setting its ghosted property true. The Mesh's ghostMaterial property holds the EmphasisMaterial that controls its appearance while ghosted.

When we don't provide it with a EmphasisMaterial, the Mesh will automatically get its Scene's ghostMaterial by default.

In the example below, we'll create a ghosted Mesh with its own EmphasisMaterial for ghosted appearance:

var mesh = new xeogl.Mesh({
   geometry: new xeogl.TeapotGeometry(),
   material: new xeogl.PhongMaterial({
       diffuse: [0.2, 0.2, 1.0]
   }),
   ghostMaterial: new xeogl.EmphasisMaterial({
       edges: true,
       edgeColor: [0.2, 1.0, 0.2],
       edgeAlpha: 1.0,
       edgeWidth: 2,
       vertices: true,
       vertexColor: [0.6, 1.0, 0.6],
       vertexAlpha: 1.0,
       vertexSize: 8,
       fill: true,
       fillColor: [0, 0, 0],
       fillAlpha: 0.7
   }),
   ghosted: true
});

Examples

Highlighting

Highlight a Mesh by setting its highlighted property true. The Mesh's highlightMaterial property holds the EmphasisMaterial that controls its appearance while highlighted.

When we don't provide it with a EmphasisMaterial for highlighting, it will automatically get its Scene's highlightMaterial by default.

In the example below, we'll create a highlighted Mesh with its own EmphasisMaterial for highlighted appearance:

var mesh = new xeogl.Mesh({
   geometry: new xeogl.TeapotGeometry(),
   material: new xeogl.PhongMaterial({
       diffuse: [0.2, 0.2, 1.0]
   }),
   highlightMaterial: new xeogl.EmphasisMaterial({
       color: [1.0, 1.0, 0.0],
       alpha: 0.6
   }),
   highlighted: true
});

Examples

Selecting

Make a Mesh appear selected by setting its selected property true. The Mesh's selectedMaterial property holds the EmphasisMaterial that controls its appearance while selected.

When we don't provide it with a EmphasisMaterial for selecting, it will automatically get its Scene's Scene/selectMaterial:property by default.

In the example below, we'll create a selected Mesh with its own EmphasisMaterial for selection appearance:

var mesh = new xeogl.Mesh({
   geometry: new xeogl.TeapotGeometry(),
   material: new xeogl.PhongMaterial({
       diffuse: [0.2, 0.2, 1.0]
   }),
   selectMaterial: new xeogl.EmphasisMaterial({
       color: [1.0, 1.0, 0.0],
       alpha: 0.6
   }),
   selected: true
});

Examples

Edges

Emphasise a Mesh's edges by setting its edges property true. The Mesh's edgeMaterial property holds the EdgeMaterial that controls the appearance of the edges while they are emphasized.

When we don't provide it with an EdgeMaterial, the Mesh will automatically get its Scene's edgeMaterial by default.

In the example below, we'll create a edges Mesh with its own EdgeMaterial for edges appearance:

var mesh = new xeogl.Mesh({
   geometry: new xeogl.TeapotGeometry(),
   material: new xeogl.PhongMaterial({
       diffuse: [0.2, 0.2, 1.0]
   }),
   edgeMaterial: new xeogl.EdgeMaterial({
       edgeColor: [0.2, 1.0, 0.2],
       edgeAlpha: 1.0,
       edgeWidth: 2
   }),
   edges: true
});

Outlining

Outline a Mesh by setting its outlined property true. The Mesh's outlineMaterial property holds the OutlineMaterial that controls its appearance while outlined.

When we don't provide it with an OutlineMaterial, it will automatically get its Scene's outlineMaterial by default.

In the example below, we'll create a outlined Mesh with its own OutlineMaterial:

var mesh = new xeogl.Mesh({
   geometry: new xeogl.TeapotGeometry(),
   material: new xeogl.PhongMaterial({
       diffuse: [0.2, 0.2, 1.0]
   }),
   outlineMaterial: new xeogl.OutlineMaterial({
       color: [1.0, 1.0, 0.0],
       alpha: 0.6,
       width: 5
   }),
   outlined: true
});

Local-space boundary

We can query a Mesh's Local-space boundary at any time, getting it as either an axis-aligned bounding box (AABB) or an object-aligned bounding box (OBB).

The Local-space AABB and OBB belong to the Mesh's Geometry.

Getting the Local-space AABB:

var aabb = mesh.geometry.aabb; // [xmin, ymin, zmin, xmax, ymax, zmax]

Getting the Local-space OBB:

var obb = mesh.geometry.obb; // Flat array containing eight 3D corner vertices of a box

Examples

World-space boundary

We can query a Mesh's World-space boundary at any time, getting it as an axis-aligned bounding box (AABB).

The World-space AABB is the boundary of the Mesh's Geometry after transformation by the Mesh's worldMatrix and the Camera's matrix.

Getting the World-space boundary AABB:

var aabb = mesh.aabb; // [xmin, ymin, zmin, xmax, ymax, zmax]

Subscribing to updates of the World-space boundary, which occur after each update to the Mesh's worldMatrix or the Camera:

mesh.on("boundary", function() {
    var aabb = mesh.aabb;
    var obb = mesh.obb;
});

The Scene also has a Scene#getAABB(), which returns the collective World-space AABBs of the Objects with the given IDs:

var scene = mesh.scene;

scene.getAABB(); // Gets collective boundary of all meshes in the scene
scene.getAABB("saw"); // Gets collective boundary of all meshes in a model
scene.getAABB(["saw", "gearbox"]); // Gets collective boundary of all meshes in two models
scene.getAABB("saw#0.1"); // Get boundary of a mesh
scene.getAABB(["saw#0.1", "saw#0.2"]); // Get collective boundary of two meshes

Excluding from boundary calculations

The Scene aabb and parent Object's aabb properties provide AABBs that dynamically include the AABB of all contained Meshes, except those Meshes that have their collidable properties set false.

Toggle that inclusion like so:

mesh.collidable = false; // Exclude mesh from calculation of its Scene/Model boundary
mesh.collidable = true; // Include mesh in calculation of its Scene/Model boundary

Setting this false is useful when a Mesh represents some element, such as a control gizmo, that you don't want to contribute to the Scene or parent Object's AABB. It also helps performance, since boundaries will not need dynamically re-calculated whenever the Mesh's boundary changes after a worldMatrix or Camera update.

Examples

Skyboxing

A Mesh has a stationary property that will cause it to never translate with respect to the viewpoint.

This is useful for using Meshes as skyboxes, like this:

new xeogl.Mesh({

    geometry: new xeogl.BoxGeometry({
        xSize: 1000,
        ySize: 1000,
        zSize: 1000
    }),

    material: new xeogl.PhongMaterial({
        diffuseMap: new xeogl.Texture({
           src: "textures/diffuse/uvGrid2.jpg"
        })
    }),

    stationary: true // Locks position with respect to viewpoint
});

Examples

Billboarding

A Mesh has a billboard property that can make it behave as a billboard.

Two billboard types are supported:

  • Spherical billboards are free to rotate their Meshes in any direction and always face the Camera perfectly.
  • Cylindrical billboards rotate their Meshes towards the Camera, but only about the Y-axis.

Note that scaling transformations to have no effect on billboarded Meshes.

The example below shows a box that remains rotated directly towards the viewpoint, using spherical billboarding:

new xeogl.Mesh({

    geometry: new xeogl.BoxGeometry(),

    material: new xeogl.PhongMaterial({
        diffuseMap: new xeogl.Texture({
           src: "textures/diffuse/uvGrid2.jpg"
        })
    }),

    billboard: "spherical" // Or "cylindrical"
});

Examples

Shadows

[Work-in-progress]

Constructor

Mesh

(
  • [scene]
  • [cfg]
)

Parameters:

  • [scene] Scene optional

    Parent Scene - creates this Mesh within xeogl's default Xeogl/scene:property by default.

  • [cfg] optional

    Configs

    • [id] String optional

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

    • [meta] String:Object optional

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

    • [entityType] String optional

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

    • [parent] Object optional

      The parent.

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

      The Mesh's local 3D position.

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

      The Mesh's local scale.

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

      The Mesh's local rotation, as Euler angles given in degrees, for each of the X, Y and Z axis.

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

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

    • [geometry] Geometry optional

      Defines shape. Must be within the same Scene as this Mesh. Defaults to the parent Scene's default instance, geometry, which is a 2x2x2 box.

    • [material] Material optional

      Defines normal rendered appearance. Must be within the same Scene as this Mesh. Defaults to the parent Scene's default instance, material.

    • [outlineMaterial] OutlineMaterial optional

      Defines appearance when outlined. Must be within the same Scene as this Mesh. Defaults to the parent Scene's default instance, outlineMaterial.

    • [ghostMaterial] #crossLink "Scene" optional

      Defines appearance when ghosted. Must be within the same }Scene{{/crossLink}} as this Mesh. Defaults to the parent {{#crossLink "Scene"}}Scene{{/crossLink}}'s default instance, {{#crossLink "Scene/ghostMaterial:property"}}ghostMaterial{{/crossLink}}.

    • [highlightMaterial] #crossLink "Scene" optional

      Defines appearance when highlighted. Must be within the same }Scene{{/crossLink}} as this Mesh. Defaults to the parent {{#crossLink "Scene"}}Scene{{/crossLink}}'s default instance, {{#crossLink "Scene/highlightMaterial:property"}}highlightMaterial{{/crossLink}}.

    • [selectedMaterial] #crossLink "Scene" optional

      Defines appearance when selected. Must be within the same }Scene{{/crossLink}} as this Mesh. Defaults to the parent {{#crossLink "Scene"}}Scene{{/crossLink}}'s default instance, {{#crossLink "Scene/selectedMaterial:property"}}selectedMaterial{{/crossLink}}.

    • [colorize=[1.0,1.0,1.0]] Float32Array optional

      RGB colorize color, multiplies by the rendered fragment colors.

    • [opacity=1.0] Number optional

      Opacity factor, multiplies by the rendered fragment alpha.

    • [layer=0] Number optional

      Indicates this Mesh's rendering priority, relative to other Meshes. Typically used for transparency sorting,

    • [stationary=false] Boolean optional

      Disables the effect of Camera translations for this Mesh. This is useful for making skyboxes.

    • [billboard="none"] String optional

      Specifies the billboarding behaviour for this Mesh. Options are "none", "spherical" and "cylindrical".

    • [visible=true] Boolean optional

      Indicates if this Mesh is visible. Mesh is only rendered when visible and not culled.

    • [culled=false] Boolean optional

      Indicates if this Mesh is culled from view. Mesh is only rendered when visible and not culled.

    • [pickable=true] Boolean optional

      Indicates if this Mesh is pickable. When false, the Mesh will never be picked by calls to the Scene pick() method, and picking will happen as "through" the Mesh, to attempt to pick whatever lies on the other side of it.

    • [clippable=true] Boolean optional

      Indicates if this Mesh is clippable by Clips. When false, Mesh will not be affected by the Scene's Clips.

    • [collidable=true] Boolean optional

      Whether this Mesh is included in boundary calculations. When false, the bounding boxes of the containing Scene and parent Object, Group or Model will not be calculated to enclose this Mesh.

    • [castShadow=true] Boolean optional

      Whether this Mesh casts shadows.

    • [receiveShadow=true] Boolean optional

      Whether this Mesh receives shadows.

    • [outlined=false] Boolean optional

      Whether an outline is rendered around this mesh.

    • [ghosted=false] Boolean optional

      Whether this Mesh is rendered with a ghosted appearance.

    • [highlighted=false] Boolean optional

      Whether this Mesh is rendered with a highlighted appearance.

    • [selected=false] Boolean optional

      Whether this Mesh is rendered with a selected appearance.

    • [aabbVisible=false] Boolean optional

      Whether this Mesh's World-space axis-aligned bounding box (AABB) is visible.

    • [obbVisible=false] Boolean optional

      Whether this Mesh's World-space oriented bounding box (OBB) is visible.

    • [colorize=[1.0,1.0,1.0]] Float32Array optional

      RGB colorize color, multiplies by the rendered fragment colors.

    • [opacity=1.0] Number optional

      Opacity factor, multiplies by the rendered fragment alpha.

    • [loading=false] Boolean optional

      Flag which indicates that this Mesh is freshly loaded.

Methods

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 superTypes, 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.

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

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

removeChild

(
  • object
)

Removes the given child.

Parameters:

  • object Object

    Child to remove.

removeChildren

()

Removes all children.

rotate

(
  • angle
)

Inherited from Object but overwritten in src/objects/object.js:904

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.

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
)

Inherited from Object but overwritten in src/objects/object.js:1012

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

billboard

String final

Indicates the billboarding behaviour.

Options are:

  • "none" - (default) - No billboarding.
  • "spherical" - Mesh is billboarded to face the viewpoint, rotating both vertically and horizontally.
  • "cylindrical" - Mesh is billboarded to face the viewpoint, rotating only about its vertically axis. Use this mode for things like trees on a landscape.

Default: "none"

castShadow

Boolean

Inherited from Object but overwritten in src/objects/mesh.js:1194

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

Inherited from Object but overwritten in src/objects/mesh.js:1148

Indicates if clippable.

When false, the Scene's Clips will have no effect on the Mesh.

Default: true

collidable

Boolean

Inherited from Object but overwritten in src/objects/mesh.js:1171

Indicates if included in boundary calculations.

When false, this Mesh will not be included in the bounding boxes provided by parent components (

Default: true

colorize

Float32Array

Inherited from Object but overwritten in src/objects/mesh.js:1260

RGB colorize color, multiplies by the rendered fragment colors.

Default: [1.0, 1.0, 1.0]

culled

Boolean

Inherited from Object but overwritten in src/objects/mesh.js:1104

Indicates if culled from view.

The MEsh is only rendered when visible is true and culled is false.

Default: false

destroyed

Boolean

True as soon as this Component has been destroyed

edgeMaterial

EdgeMaterial

Defines surface appearance when edges are shown.

edges

Boolean

Inherited from Object but overwritten in src/objects/mesh.js:1081

Indicates if edges are shown.

The edges appearance is configured by edgeMaterial.

Default: false

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

geometry

Geometry final

Defines the shape of this Mesh.

ghosted

Boolean

Inherited from Object but overwritten in src/objects/mesh.js:991

Indicates if ghosted.

The ghosted appearance is configured by ghostMaterial.

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

Default: false

ghostMaterial

EmphasisMaterial final

Defines surface appearance when ghosted.

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.

highlighted

Boolean

Inherited from Object but overwritten in src/objects/mesh.js:1021

Indicates if highlighted.

The highlight appearance is configured by highlightMaterial.

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

Default: false

highlightMaterial

EmphasisMaterial final

Defines surface appearance when highlighted.

id

String final

Unique ID for this Component within its parent Scene.

layer

Number

The rendering order.

This can be set on multiple transparent Meshes, to make them render in a specific order for correct alpha blending.

Default: 0

material

Material final

Defines appearance when rendering normally, ie. when not ghosted, highlighted or selected.

matrix

Float32Array

Local matrix.

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

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.

opacity

Number

Inherited from Object but overwritten in src/objects/mesh.js:1290

Opacity factor, multiplies by the rendered fragment alpha.

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

Default: 1.0

outlined

Boolean

Inherited from Object but overwritten in src/objects/mesh.js:1237

Indicates if rendered with an outline.

The outline appearance is configured by outlineMaterial.

Default: false

outlineMaterial

OutlineMaterial

Defines surface appearance when outlined.

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

Inherited from Object but overwritten in src/objects/mesh.js:1124

Indicates if pickable.

When false, the Mesh will never be picked by calls to the Scene pick() method, and picking will happen as "through" the Mesh, to attempt to pick whatever lies on the other side of it.

Default: true

position

Float32Array

Local translation.

Default: [0,0,0]

quaternion

Float32Array

Local rotation quaternion.

Default: [0,0,0, 1]

receiveShadow

Boolean

Inherited from Object but overwritten in src/objects/mesh.js:1215

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

Inherited from Object but overwritten in src/objects/mesh.js:1051

Indicates if selected.

The selected appearance is configured by selectedMaterial.

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

Default: false

selectedMaterial

EmphasisMaterial

Defines surface appearance when selected.

stationary

Boolean final

Indicates if the position is stationary.

When true, will disable the effect of Lookat translations for this Mesh, while still allowing it to rotate. This is useful for skybox Meshes.

Default: false

superTypes

Array of String final

An array of strings that indicates the chain of super-types within this component's inheritance hierarchy.

For example, if this component is a Rotate, which extends Transform, which in turn extends Component, then this property will have the value:

["xeogl.Component", "xeogl.Transform"]
                    

Note that the chain is ordered downwards in the hierarchy, ie. from super-class down towards sub-class.

type

String final

Inherited from Component but overwritten in src/objects/object.js:606

JavaScript class name for this xeogl.Object.

visible

Boolean

Inherited from Object but overwritten in src/objects/mesh.js:963

Indicates if visible.

The Mesh is only rendered when visible is true and culled is false.

Each visible Mesh is registered in the Scene's visibleEntities map when 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]

worldPositions

Float32Array final

World-space 3D vertex positions.

These are internally generated on-demand and cached. To free the cached vertex World positions when you're done with them, set this property to null or undefined.

Events

destroyed

Fired when this Component is destroyed.

picked

Fired when this Mesh is picked via a call to Scene#pick().

The event parameters will be the hit result returned by the Scene#pick() method.