MeshMaterial

require(["esri/geometry/support/MeshMaterial"], function(MeshMaterial) { /* code goes here */ });
Class: esri/geometry/support/MeshMaterial
Inheritance: MeshMaterial Accessor
Since: ArcGIS API for JavaScript 4.11

The material determines how a mesh component is visualized. Among other properties, MeshMaterial specifies a color that may be a Color value, as well as a colorTexture that may be a MeshTexture), which is mapped to the uv coordinate specified for each vertex in the Mesh.vertexAttributes.

The material properties support a number of convenience autocast types, including hex color strings and well known color strings (autocasts to Color), or strings representing urls, HTMLImageElements or HTMLCanvasElements (autocasts to MeshTexture).

function createLinearGradient() {
  var canvas = document.createElement("canvas");
  canvas.width = 32;
  canvas.height = 32;

  var ctx = canvas.getContext("2d");

  // Create the linear gradient with which to fill the canvas
  var gradient = ctx.createLinearGradient(0, 0, 0, 32);
  gradient.addColorStop(0, "#00ff00");
  gradient.addColorStop(1, "#009900");

  // Fill the canvas with the gradient pattern
  ctx.fillStyle = gradient;
  ctx.fillRect(0, 0, 32, 32);

  return canvas;
}

var component = new MeshComponent({
  material: {
    // Autocast canvas element to MeshTexture instance
    colorTexture: createLinearGradient()
  }
});

var component2 = new MeshComponent({
  material: {
    // Autocast hex color to ValueMeshColor instance
    color: "#ff00ff"
  }
});
See also:

Constructors

new MeshMaterial(properties)
Parameter:
properties Object
optional

See the properties for a list of all the properties that may be passed into the constructor.

Property Overview

Any properties can be set, retrieved or listened to. See the Working with Properties topic.
NameTypeSummaryClass
Number

Specifies how transparency on the object is handled.

more details
more detailsMeshMaterial
String

Specifies how transparency on the object is handled.

more details
more detailsMeshMaterial
Color

Allows to specify a single, uniform color for the mesh component.

more details
more detailsMeshMaterial
MeshTexture

Allows to specify a texture to get color information from.

more details
more detailsMeshMaterial
String

The name of the class.

more details
more detailsAccessor
Boolean

Specifies whether both sides of each triangle are displayed, or only the front sides.

more details
more detailsMeshMaterial
MeshTexture

Allows to specify a texture to get normal information from.

more details
more detailsMeshMaterial

Property Details

alphaCutoff Number

Specifies how transparency on the object is handled. If alphaMode is set to either mask or auto this property specifies the cutoff value below which masking happens (that is, the coresponding part of the Mesh is rendered fully transparent).

Default Value:0.5
alphaMode String

Specifies how transparency on the object is handled. See also alphaCutoff.

TypeDescription
opaqueAlpha is ignored, and the object is rendered fully opaque.
blendAlpha values are used for gradual transparency, blending between the object and its background.
maskAlpha values are used for binary transparency, either displaying the object, or its background. See also alphaCutoff.
autoThe implementation mixes the mask and blend settings, masking below alphaCutoff and blending above it.
Default Value:"auto"
Autocasts from Object|Number[]|String

Allows to specify a single, uniform color for the mesh component. This can be autocast with a named string, hex string, array of rgb or rgba values, an object with r, g, b, and a properties, or a Color object.

colorTexture MeshTextureautocast

Allows to specify a texture to get color information from. The texture is accessed using the uv coordinate specified for each vertex in the mesh vertex attributes.

declaredClass Stringreadonly inherited

The name of the class. The declared class name is formatted as esri.folder.className.

doubleSided Boolean

Specifies whether both sides of each triangle are displayed, or only the front sides.

Default Value:true
normalTexture MeshTextureautocast

Allows to specify a texture to get normal information from. The texture is accessed using the uv coordinate specified for each vertex in the mesh vertex attributes. Normal mapping requires also for tangents to be specified in the mesh vertex attributes.

API Reference search results

NameTypeModule
Loading...