The main class for styling mesh data is MeshStyle. You can use it to define several expressions to visualize, filter, and change your dataset:

  • colorExpression: create an expression to decide the color of your mesh. A color expression overrides any texture color in the dataset.

  • selectedColorExpression: create an expression to decide the color for selected parts of your mesh. See Selecting mesh data for more information.

  • visibilityExpression: create an expression to make meshes partly or fully visible or invisible based on available attributes and parameters.

  • displacementExpression: create an expression to partly or fully displace meshes based on available attributes and parameters.

You must use ExpressionFactory to create the styling expressions. See Property-based styling and filtering of points on a WebGLMap for more information about styling through expressions. See the MeshStyle API reference documentation for example code.

You can also use MeshStyle to manipulate the lighting of the mesh data. Use lighting to pass a Boolean value that indicates whether the lighting effect on the map has an effect on the data set. The default value is true. For more information about map lighting, see Configuring WebGL Map effects.

MeshStyle also supports PBR shading through PBRSettings.

Program: Using a mesh style.
import {color, defaultColor, multiply} from "@luciad/ria/util/expression/ExpressionFactory.js";
import {OGC3DTilesModel} from "@luciad/ria/model/tileset/OGC3DTilesModel.js";
import {TileSet3DLayer} from "@luciad/ria/view/tileset/TileSet3DLayer.js";

layer.meshStyle = {
  selectedColorExpression: multiply(color("rgb(255,148,76)"), defaultColor()),
  lighting: false

If your expression results in transparent colors, see Transparent colors how to enable transparency support.