import {LambertMaterial} from '@xeokit/xeokit-sdk/src/viewer/scene/materials/LambertMaterial.js'
LambertMaterial
Configures the normal rendered appearance of Meshes using the non-realistic but GPU-efficient Lambertian flat shading model for calculating reflectance.
- Useful for efficiently rendering non-realistic objects for high-detail CAD.
- Use PhongMaterial when you need specular highlights.
- Use the physically-based MetallicMaterial or SpecularMaterial when you need more realism.
- For LambertMaterial, the illumination calculation is performed at each triangle vertex, and the resulting color is interpolated across the face of the triangle. For PhongMaterial, MetallicMaterial and SpecularMaterial, vertex normals are interpolated across the surface of the triangle, and the illumination calculation is performed at each texel.
Usage
In the example below we'll create a Mesh with a shape defined by a buildTorusGeometry and normal rendering appearance configured with a LambertMaterial.
import {Viewer, Mesh, buildTorusGeometry, ReadableGeometry, LambertMaterial} from "xeokit-sdk.es.js";
const viewer = new Viewer({
canvasId: "myCanvas"
});
viewer.scene.camera.eye = [0, 0, 5];
viewer.scene.camera.look = [0, 0, 0];
viewer.scene.camera.up = [0, 1, 0];
new Mesh(viewer.scene, {
geometry: new ReadableGeometry(viewer.scene, buildTorusGeometry({
center: [0, 0, 0],
radius: 1.5,
tube: 0.5,
radialSegments: 12,
tubeSegments: 8,
arc: Math.PI * 2.0
}),
material: new LambertMaterial(viewer.scene, {
ambient: [0.3, 0.3, 0.3],
color: [0.5, 0.5, 0.0],
alpha: 1.0, // Default
lineWidth: 1,
pointSize: 1,
backfaces: false,
frontFace: "ccw"
})
});
LambertMaterial Properties
The following table summarizes LambertMaterial properties:
Property | Type | Range | Default Value | Space | Description |
---|---|---|---|---|---|
LambertMaterial#ambient | Array | [0, 1] for all components | [1,1,1,1] | linear | The RGB components of the ambient light reflected by the material. |
LambertMaterial#color | Array | [0, 1] for all components | [1,1,1,1] | linear | The RGB components of the diffuse light reflected by the material. |
LambertMaterial#emissive | Array | [0, 1] for all components | [0,0,0] | linear | The RGB components of the light emitted by the material. |
LambertMaterial#alpha | Number | [0, 1] | 1 | linear | The transparency of the material surface (0 fully transparent, 1 fully opaque). |
LambertMaterial#lineWidth | Number | [0..100] | 1 | Line width in pixels. | |
LambertMaterial#pointSize | Number | [0..100] | 1 | Point size in pixels. | |
LambertMaterial#backfaces | Boolean | false | Whether to render Geometry backfaces. | ||
LambertMaterial#frontface | String | "ccw", "cw" | "ccw" | The winding order for Geometry frontfaces - "cw" for clockwise, or "ccw" for counter-clockwise. |
Constructor Summary
Public Constructor | ||
public |
constructor(owner: Component, cfg: *) |
Member Summary
Public Members | ||
public set |
Sets factor in the range |
|
public get |
Gets factor in the range |
|
public set |
Sets the LambertMaterial's ambient color. Default value is |
|
public get |
Gets the LambertMaterial's ambient color. Default value is |
|
public set |
Sets whether backfaces are visible on attached Meshes. |
|
public get |
Gets whether backfaces are visible on attached Meshes. |
|
public set |
Sets the LambertMaterial's diffuse color. Default value is |
|
public get |
Gets the LambertMaterial's diffuse color. Default value is |
|
public set |
Sets the LambertMaterial's emissive color. Default value is |
|
public get |
Gets the LambertMaterial's emissive color. Default value is |
|
public set | ||
public get | ||
public set |
Sets the LambertMaterial's line width. This is not supported by WebGL implementations based on DirectX [2019]. Default value is |
|
public get |
Gets the LambertMaterial's line width. This is not supported by WebGL implementations based on DirectX [2019]. Default value is |
|
public set |
Sets the LambertMaterial's point size. Default value is |
|
public get |
Gets the LambertMaterial's point size. Default value is |
Method Summary
Public Methods | ||
public |
destroy() Destroys this LambertMaterial. |
Inherited Summary
From class Component | ||
public get |
The Component that owns the lifecycle of this Component, if any. |
|
public |
True as soon as this Component has been destroyed |
|
public |
ID of this Component, unique within the Scene. |
|
public |
meta: * Arbitrary, user-defined metadata on this component. |
|
public |
The parent Scene that contains this Component. |
|
public |
The viewer that contains this Scene. |
|
public |
clear() Destroys all Components that are owned by this. |
|
public |
destroy() Destroys this component. |
|
public |
Logs an error for this component to the JavaScript console. |
|
public |
Fires an event on this component. |
|
public |
Returns true if there are any subscribers to the given event on this component. |
|
public |
Tests if this component is of the given type, or is a subclass of the given type. |
|
public |
Logs a console debugging message for this component. |
|
public |
Cancels an event subscription that was previously made with Component#on or Component#once. |
|
public |
Subscribes to an event on this component. |
|
public |
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 |
Logs a warning for this component to the JavaScript console. |
From class Material | ||
public |
destroy() |
Public Constructors
public constructor(owner: Component, cfg: *) source
Override:
Material#constructorParams:
Name | Type | Attribute | Description |
owner | Component | Owner component. When destroyed, the owner will destroy this component as well. |
|
cfg | * |
|
The LambertMaterial configuration |
cfg.id | String |
|
Optional ID, unique among all components in the parent Scene, generated automatically when omitted. |
cfg.meta | String:Object |
|
Metadata to attach to this LambertMaterial. |
cfg.ambient | Number[] |
|
LambertMaterial ambient color. |
cfg.color | Number[] |
|
LambertMaterial diffuse color. |
cfg.emissive | Number[] |
|
LambertMaterial emissive color. |
cfg.alpha | Number |
|
Scalar in range 0-1 that controls alpha, where 0 is completely transparent and 1 is completely opaque. |
cfg.reflectivity | Number |
|
Scalar in range 0-1 that controls how much ReflectionMap is reflected. |
cfg.lineWidth | Number |
|
Scalar that controls the width of Geometry lines. |
cfg.pointSize | Number |
|
Scalar that controls the size of points for Geometry with Geometry#primitive set to "points". |
cfg.backfaces | Boolean |
|
Whether to render Geometry backfaces. |
cfg.frontface | Boolean |
|
The winding order for Geometry front faces - "cw" for clockwise, or "ccw" for counter-clockwise. |
Public Members
public set alpha: Number source
Sets factor in the range [0..1]
indicating how transparent the LambertMaterial is.
A value of 0.0
indicates fully transparent, 1.0
is fully opaque.
Default value is 1.0
public get alpha: Number source
Gets factor in the range [0..1]
indicating how transparent the LambertMaterial is.
A value of 0.0
indicates fully transparent, 1.0
is fully opaque.
Default value is 1.0
public set ambient: Number[] source
Sets the LambertMaterial's ambient color.
Default value is [0.3, 0.3, 0.3]
.
public get ambient: Number[] source
Gets the LambertMaterial's ambient color.
Default value is [0.3, 0.3, 0.3]
.
public set color: Number[] source
Sets the LambertMaterial's diffuse color.
Default value is [1.0, 1.0, 1.0]
.
public get color: Number[] source
Gets the LambertMaterial's diffuse color.
Default value is [1.0, 1.0, 1.0]
.
public set emissive: Number[] source
Sets the LambertMaterial's emissive color.
Default value is [0.0, 0.0, 0.0]
.
public get emissive: Number[] source
Gets the LambertMaterial's emissive color.
Default value is [0.0, 0.0, 0.0]
.
public set lineWidth: Number source
Sets the LambertMaterial's line width.
This is not supported by WebGL implementations based on DirectX [2019].
Default value is 1.0
.