ThreeJS Material - Mesh

MeshBasicMaterial

A material for drawing geometries in a simple shaded (flat or wireframe) way.

This material is not affected by lights.

Constructor

MeshBasicMaterial( parameters : Object )

parameters - (optional) an object with one or more properties defining the material's appearance. Any property of the material (including any property inherited from Material) can be passed in here.

The exception is the property color, which can be passed in as a hexadecimal string and is 0xffffff (white) by default. Color.set( color ) is called internally.

Properties

See the base Material class for common properties.

.alphaMap : Texture

The alpha map is a grayscale texture that controls the opacity across the surface (black: fully transparent; white: fully opaque). Default is null.

Only the color of the texture is used, ignoring the alpha channel if one exists. For RGB and RGBA textures, the WebGL renderer will use the green channel when sampling this texture due to the extra bit of precision provided for green in DXT-compressed and uncompressed RGB 565 formats. Luminance-only and luminance/alpha textures will also still work as expected.

.aoMap : Texture

The red channel of this texture is used as the ambient occlusion map. Default is null. The aoMap requires a second set of UVs.

.aoMapIntensity : Float

Intensity of the ambient occlusion effect. Default is 1. Zero is no occlusion effect.

.color : Color

Color of the material, by default set to white (0xffffff).

.combine : Integer

How to combine the result of the surface's color with the environment map, if any.

Options are THREE.Multiply (default), THREE.MixOperation, THREE.AddOperation. If mix is chosen, the .reflectivity is used to blend between the two colors.

.envMap : Texture

The environment map. Default is null.

.lightMap : Texture

The light map. Default is null. The lightMap requires a second set of UVs.

.lightMapIntensity : Float

Intensity of the baked light. Default is 1.

.map : Texture

The color map. Default is null.

.reflectivity : Float

How much the environment map affects the surface; also see .combine. The default value is 1 and the valid range is between 0 (no reflections) and 1 (full reflections).

.refractionRatio : Float

The index of refraction (IOR) of air (approximately 1) divided by the index of refraction of the material. It is used with environment mapping modes THREE.CubeRefractionMapping and THREE.EquirectangularRefractionMapping. The refraction ratio should not exceed 1. Default is 0.98.

.specularMap : Texture

Specular map used by the material. Default is null.

.wireframe : Boolean

Render geometry as wireframe. Default is false (i.e. render as flat polygons).

.wireframeLinecap : String

Define appearance of line ends. Possible values are "butt", "round" and "square". Default is 'round'.

This corresponds to the 2D Canvas lineCap property and it is ignored by the WebGL renderer.

.wireframeLinejoin : String

Define appearance of line joints. Possible values are "round", "bevel" and "miter". Default is 'round'.

This corresponds to the 2D Canvas lineJoin property and it is ignored by the WebGL renderer.

.wireframeLinewidth : Float

Controls wireframe thickness. Default is 1.

Due to limitations of the OpenGL Core Profile with the WebGL renderer on most platforms linewidth will always be 1 regardless of the set value.

Methods

See the base Material class for common methods.

MeshDepthMaterial

A material for drawing geometry by depth. Depth is based off of the camera near and far plane. White is nearest, black is farthest.

Constructor

MeshDepthMaterial( parameters : Object )

parameters - (optional) an object with one or more properties defining the material's appearance. Any property of the material (including any property inherited from Material) can be passed in here.

Properties

See the base Material class for common properties.

.alphaMap : Texture

The alpha map is a grayscale texture that controls the opacity across the surface (black: fully transparent; white: fully opaque). Default is null.

Only the color of the texture is used, ignoring the alpha channel if one exists. For RGB and RGBA textures, the WebGL renderer will use the green channel when sampling this texture due to the extra bit of precision provided for green in DXT-compressed and uncompressed RGB 565 formats. Luminance-only and luminance/alpha textures will also still work as expected.

.depthPacking : Constant

Encoding for depth packing. Default is BasicDepthPacking.

.displacementMap : Texture

The displacement map affects the position of the mesh's vertices. Unlike other maps which only affect the light and shade of the material the displaced vertices can cast shadows, block other objects, and otherwise act as real geometry. The displacement texture is an image where the value of each pixel (white being the highest) is mapped against, and repositions, the vertices of the mesh.

.displacementScale : Float

How much the displacement map affects the mesh (where black is no displacement, and white is maximum displacement). Without a displacement map set, this value is not applied. Default is 1.

.displacementBias : Float

The offset of the displacement map's values on the mesh's vertices. Without a displacement map set, this value is not applied. Default is 0.

.fog : Boolean

Whether the material is affected by fog. Default is false.

.map : Texture

The color map. Default is null.

.wireframe : Boolean

Render geometry as wireframe. Default is false (i.e. render as smooth shaded).

.wireframeLinewidth : Float

Controls wireframe thickness. Default is 1.

Due to limitations of the OpenGL Core Profile with the WebGL renderer on most platforms linewidth will always be 1 regardless of the set value.

Methods

See the base Material class for common methods.

MeshDistanceMaterial

MeshDistanceMaterial is internally used for implementing shadow mapping with PointLights.

Can also be used to customize the shadow casting of an object by assigning an instance of MeshDistanceMaterial to Object3D.customDistanceMaterial. The following examples demonstrates this approach in order to ensure transparent parts of objects do no cast shadows.

Constructor

MeshDistanceMaterial( parameters : Object )

parameters - (optional) an object with one or more properties defining the material's appearance. Any property of the material (including any property inherited from Material) can be passed in here.

Properties

See the base Material class for common properties.

.alphaMap : Texture

The alpha map is a grayscale texture that controls the opacity across the surface (black: fully transparent; white: fully opaque). Default is null.

Only the color of the texture is used, ignoring the alpha channel if one exists. For RGB and RGBA textures, the WebGL renderer will use the green channel when sampling this texture due to the extra bit of precision provided for green in DXT-compressed and uncompressed RGB 565 formats. Luminance-only and luminance/alpha textures will also still work as expected.

.displacementMap : Texture

The displacement map affects the position of the mesh's vertices. Unlike other maps which only affect the light and shade of the material the displaced vertices can cast shadows, block other objects, and otherwise act as real geometry. The displacement texture is an image where the value of each pixel (white being the highest) is mapped against, and repositions, the vertices of the mesh.

.displacementScale : Float

How much the displacement map affects the mesh (where black is no displacement, and white is maximum displacement). Without a displacement map set, this value is not applied. Default is 1.

.displacementBias : Float

The offset of the displacement map's values on the mesh's vertices. Without a displacement map set, this value is not applied. Default is 0.

.farDistance : Float

The far value of the point light's internal shadow camera.

.fog : Boolean

Whether the material is affected by fog. Default is false.

.map : Texture

The color map. Default is null.

.nearDistance : Float

The near value of the point light's internal shadow camera.

.referencePosition : Vector3

The position of the point light in world space.

Methods

See the base Material class for common methods.

MeshLambertMaterial

A non-shiny surface material with no specular highlights.

For calculating reflectance, the material employs a Lambertian model that is not physically based. This can accurately simulate some surfaces (such as untreated wood or stone), but not shiny surfaces with specular highlights (such as varnished wood).

A Gouraud shading model is used to calculate shading. This computes shading per vertex (i.e. in the vertex shader) and interpolates the results across the faces of the polygon.

Because of the simplicity of the reflectance and illumination models, this material outperforms the MeshPhongMaterial, MeshStandardMaterial, and MeshPhysicalMaterial, at the expense of some graphical accuracy.

Constructor

MeshLambertMaterial( parameters : Object )

parameters - (optional) an object with one or more properties defining the material's appearance. Any property of the material (including any property inherited from Material) can be passed in here.

The exception is the property color, which can be passed in as a hexadecimal string and is 0xffffff (white) by default. Color.set( color ) is called internally.

Properties

See the base Material class for common properties.

.alphaMap : Texture

The alpha map is a grayscale texture that controls the opacity across the surface (black: fully transparent; white: fully opaque). Default is null.

Only the color of the texture is used, ignoring the alpha channel if one exists. For RGB and RGBA textures, the WebGL renderer will use the green channel when sampling this texture due to the extra bit of precision provided for green in DXT-compressed and uncompressed RGB 565 formats. Luminance-only and luminance/alpha textures will also still work as expected.

.aoMap : Texture

The red channel of this texture is used as the ambient occlusion map. Default is null. The aoMap requires a second set of UVs.

.aoMapIntensity : Float

Intensity of the ambient occlusion effect. Default is 1. Zero is no occlusion effect.

.color : Color

Color of the material, by default set to white (0xffffff).

.combine : Integer

How to combine the result of the surface's color with the environment map, if any.

Options are THREE.Multiply (default), THREE.MixOperation, THREE.AddOperation. If mix is chosen, the .reflectivity is used to blend between the two colors.

.emissive : Color

Emissive (light) color of the material, essentially a solid color unaffected by other lighting. Default is black.

.emissiveMap : Texture

Set emissive (glow) map. Default is null. The emissive map color is modulated by the emissive color and the emissive intensity. If you have an emissive map, be sure to set the emissive color to something other than black.

.emissiveIntensity : Float

Intensity of the emissive light. Modulates the emissive color. Default is 1.

.envMap : Texture

The environment map. Default is null.

.lightMap : Texture

The light map. Default is null. The lightMap requires a second set of UVs.

.lightMapIntensity : Float

Intensity of the baked light. Default is 1.

.map : Texture

The color map. Default is null.

.reflectivity : Float

How much the environment map affects the surface; also see .combine.

.refractionRatio : Float

The index of refraction (IOR) of air (approximately 1) divided by the index of refraction of the material. It is used with environment mapping modes THREE.CubeRefractionMapping and THREE.EquirectangularRefractionMapping. The refraction ratio should not exceed 1. Default is 0.98.

.specularMap : Texture

Specular map used by the material. Default is null.

.wireframe : Boolean

Render geometry as wireframe. Default is false (i.e. render as flat polygons).

.wireframeLinecap : String

Define appearance of line ends. Possible values are "butt", "round" and "square". Default is 'round'.

This corresponds to the 2D Canvas lineCap property and it is ignored by the WebGL renderer.

.wireframeLinejoin : String

Define appearance of line joints. Possible values are "round", "bevel" and "miter". Default is 'round'.

This corresponds to the 2D Canvas lineJoin property and it is ignored by the WebGL renderer.

.wireframeLinewidth : Float

Controls wireframe thickness. Default is 1.

Due to limitations of the OpenGL Core Profile with the WebGL renderer on most platforms linewidth will always be 1 regardless of the set value.

Methods

See the base Material class for common methods.

MeshMatcapMaterial

MeshMatcapMaterial is defined by a MatCap (or Lit Sphere) texture that encodes the colour and shading of the material.

Because the matcap image file encodes baked lighting, MeshMatcapMaterial does not respond to lights. It will cast a shadow on an object that receives shadows (and shadow clipping is supported), but it will not cast or receive shadows.

Constructor

MeshMatcapMaterial( parameters : Object )

parameters - (optional) an object with one or more properties defining the material's appearance. Any property of the material (including any property inherited from Material) can be passed in here.

The exception is the property color, which can be passed in as a hexadecimal string and is 0xffffff (white) by default. Color.set( color ) is called internally.

Properties

See the base Material class for common properties.

.alphaMap : Texture

The alpha map is a grayscale texture that controls the opacity across the surface (black: fully transparent; white: fully opaque). Default is null.

Only the color of the texture is used, ignoring the alpha channel if one exists. For RGB and RGBA textures, the WebGL renderer will use the green channel when sampling this texture due to the extra bit of precision provided for green in DXT-compressed and uncompressed RGB 565 formats. Luminance-only and luminance/alpha textures will also still work as expected.

.bumpMap : Texture

The texture to create a bump map. The black and white values map to the perceived depth in relation to the lights. Bump doesn't actually affect the geometry of the object, only the lighting. If a normal map is defined this will be ignored.

.bumpScale : Float

How much the bump map affects the material. Typical ranges are 0-1. Default is 1.

.color : Color

Color of the material, by default set to white (0xffffff).

.displacementMap : Texture

The displacement map affects the position of the mesh's vertices. Unlike other maps which only affect the light and shade of the material the displaced vertices can cast shadows, block other objects, and otherwise act as real geometry. The displacement texture is an image where the value of each pixel (white being the highest) is mapped against, and repositions, the vertices of the mesh.

.displacementScale : Float

How much the displacement map affects the mesh (where black is no displacement, and white is maximum displacement). Without a displacement map set, this value is not applied. Default is 1.

.displacementBias : Float

The offset of the displacement map's values on the mesh's vertices. Without a displacement map set, this value is not applied. Default is 0.

.flatShading : Boolean

Define whether the material is rendered with flat shading. Default is false.

.map : Texture

The color map. Default is null. The texture map color is modulated by the diffuse .color.

.matcap : Texture

The matcap map. Default is null.

.normalMap : Texture

The texture to create a normal map. The RGB values affect the surface normal for each pixel fragment and change the way the color is lit. Normal maps do not change the actual shape of the surface, only the lighting. In case the material has a normal map authored using the left handed convention, the y component of normalScale should be negated to compensate for the different handedness.

.normalMapType : Integer

The type of normal map.

Options are THREE.TangentSpaceNormalMap (default), and THREE.ObjectSpaceNormalMap.

.normalScale : Vector2

How much the normal map affects the material. Typical ranges are 0-1. Default is a Vector2 set to (1,1).

Methods

See the base Material class for common methods.

MeshNormalMaterial

A material that maps the normal vectors to RGB colors.

Constructor

MeshNormalMaterial( parameters : Object )

parameters - (optional) an object with one or more properties defining the material's appearance. Any property of the material (including any property inherited from Material) can be passed in here.

Properties

See the base Material class for common properties.

.bumpMap : Texture

The texture to create a bump map. The black and white values map to the perceived depth in relation to the lights. Bump doesn't actually affect the geometry of the object, only the lighting. If a normal map is defined this will be ignored.

.bumpScale : Float

How much the bump map affects the material. Typical ranges are 0-1. Default is 1.

.displacementMap : Texture

The displacement map has an effect on the vertices of the mesh. Unlike other maps, which only affect the material's light and shade, the displaced vertices can cast shadows, block other objects, and otherwise function as real geometry. The displacement texture is an image in which the value of each pixel (white being the highest) is mapped against the vertices of the mesh and repositions them.

.displacementScale : Float

How much the displacement map affects the mesh (where black is no displacement, and white is maximum displacement). Without a displacement map set, this value is not applied. Default is 1.

.displacementBias : Float

The offset of the displacement map's values on the mesh's vertices. Without a displacement map set, this value is not applied. Default is 0.

.flatShading : Boolean

Define whether the material is rendered with flat shading. Default is false.

.fog : Boolean

Whether the material is affected by fog. Default is false.

.normalMap : Texture

The texture to create a normal map. The RGB values affect the surface normal for each pixel fragment and change the way the color is lit. Normal maps do not change the actual shape of the surface, only the lighting. In case the material has a normal map authored using the left handed convention, the y component of normalScale should be negated to compensate for the different handedness.

.normalScale : Vector2

How much the normal map affects the material. Typical ranges are 0-1. Default is a Vector2 set to (1,1).

.wireframe : Boolean

Render geometry as wireframe. Default is false (i.e. render as smooth shaded).

.wireframeLinewidth : Float

Controls wireframe thickness. Default is 1.

Due to limitations of the OpenGL Core Profile with the WebGL renderer on most platforms linewidth will always be 1 regardless of the set value.

Methods

See the base Material class for common methods.

MeshPhongMaterial

A shiny surface material with specular highlights.

For calculating reflectance, the material employs a non-physically based Blinn-Phong model. In contrast to the Lambertian model used in the MeshLambertMaterial, this model can simulate shiny surfaces with specular highlights (such as varnished wood).

A Phong shading model is used to calculate shading. This calculates shading per pixel (i.e. in the fragment shader, also known as the pixel shader), which produces more accurate results than the Gouraud model used by MeshLambertMaterial, but at the expense of some performance. This shading model is also used by MeshStandardMaterial and MeshPhysicalMaterial.

When using this material instead of MeshStandardMaterial or MeshPhysicalMaterial, performance will generally be better, at the expense of some graphical accuracy.

Constructor

MeshPhongMaterial( parameters : Object )

parameters - (optional) an object with one or more properties defining the material's appearance. Any property of the material (including any property inherited from Material) can be passed in here.

The exception is the property color, which can be passed in as a hexadecimal string and is 0xffffff (white) by default. Color.set( color ) is called internally.

Properties

See the base Material class for common properties.

.alphaMap : Texture

The alpha map is a grayscale texture that controls the opacity across the surface (black: fully transparent; white: fully opaque). Default is null.

Only the color of the texture is used, ignoring the alpha channel if one exists. For RGB and RGBA textures, the WebGL renderer will use the green channel when sampling this texture due to the extra bit of precision provided for green in DXT-compressed and uncompressed RGB 565 formats. Luminance-only and luminance/alpha textures will also still work as expected.

.aoMap : Texture

The red channel of this texture is used as the ambient occlusion map. Default is null. The aoMap requires a second set of UVs.

.aoMapIntensity : Float

Intensity of the ambient occlusion effect. Default is 1. Zero is no occlusion effect.

.bumpMap : Texture

The texture to create a bump map. The black and white values map to the perceived depth in relation to the lights. Bump doesn't actually affect the geometry of the object, only the lighting. If a normal map is defined this will be ignored.

.bumpScale : Float

How much the bump map affects the material. Typical ranges are 0-1. Default is 1.

.color : Color

Color of the material, by default set to white (0xffffff).

.combine : Integer

How to combine the result of the surface's color with the environment map, if any.

Options are THREE.MultiplyOperation (default), THREE.MixOperation, THREE.AddOperation. If mix is chosen, the .reflectivity is used to blend between the two colors.

.displacementMap : Texture

The displacement map affects the position of the mesh's vertices. Unlike other maps which only affect the light and shade of the material the displaced vertices can cast shadows, block other objects, and otherwise act as real geometry. The displacement texture is an image where the value of each pixel (white being the highest) is mapped against, and repositions, the vertices of the mesh.

.displacementScale : Float

How much the displacement map affects the mesh (where black is no displacement, and white is maximum displacement). Without a displacement map set, this value is not applied. Default is 1.

.displacementBias : Float

The offset of the displacement map's values on the mesh's vertices. Without a displacement map set, this value is not applied. Default is 0.

.emissive : Color

Emissive (light) color of the material, essentially a solid color unaffected by other lighting. Default is black.

.emissiveMap : Texture

Set emissive (glow) map. Default is null. The emissive map color is modulated by the emissive color and the emissive intensity. If you have an emissive map, be sure to set the emissive color to something other than black.

.emissiveIntensity : Float

Intensity of the emissive light. Modulates the emissive color. Default is 1.

.envMap : Texture

The environment map. Default is null.

.flatShading : Boolean

Define whether the material is rendered with flat shading. Default is false.

.lightMap : Texture

The light map. Default is null. The lightMap requires a second set of UVs.

.lightMapIntensity : Float

Intensity of the baked light. Default is 1.

.map : Texture

The color map. Default is null. The texture map color is modulated by the diffuse .color.

.normalMap : Texture

The texture to create a normal map. The RGB values affect the surface normal for each pixel fragment and change the way the color is lit. Normal maps do not change the actual shape of the surface, only the lighting. In case the material has a normal map authored using the left handed convention, the y component of normalScale should be negated to compensate for the different handedness.

.normalScale : Vector2

How much the normal map affects the material. Typical ranges are 0-1. Default is a Vector2 set to (1,1).

.reflectivity : Float

How much the environment map affects the surface; also see .combine. The default value is 1 and the valid range is between 0 (no reflections) and 1 (full reflections).

.refractionRatio : Float

The index of refraction (IOR) of air (approximately 1) divided by the index of refraction of the material. It is used with environment mapping modes THREE.CubeRefractionMapping and THREE.EquirectangularRefractionMapping. The refraction ratio should not exceed 1. Default is 0.98.

.shininess : Float

How shiny the .specular highlight is; a higher value gives a sharper highlight. Default is 30.

.specular : Color

Specular color of the material. Default is a Color set to 0x111111 (very dark grey).

This defines how shiny the material is and the color of its shine.

.specularMap : Texture

The specular map value affects both how much the specular surface highlight contributes and how much of the environment map affects the surface. Default is null.

.wireframe : Boolean

Render geometry as wireframe. Default is false (i.e. render as flat polygons).

.wireframeLinecap : String

Define appearance of line ends. Possible values are "butt", "round" and "square". Default is 'round'.

This corresponds to the 2D Canvas lineCap property and it is ignored by the WebGL renderer.

.wireframeLinejoin : String

Define appearance of line joints. Possible values are "round", "bevel" and "miter". Default is 'round'.

This corresponds to the 2D Canvas lineJoin property and it is ignored by the WebGL renderer.

.wireframeLinewidth : Float

Controls wireframe thickness. Default is 1.

Due to limitations of the OpenGL Core Profile with the WebGL renderer on most platforms linewidth will always be 1 regardless of the set value.

Methods

See the base Material class for common methods.

MeshPhysicalMaterial

An extension of the MeshStandardMaterial, providing more advanced physically-based rendering properties:

  • Clearcoat: Some materials — like car paints, carbon fiber, and wet surfaces — require a clear, reflective layer on top of another layer that may be irregular or rough. Clearcoat approximates this effect, without the need for a separate transparent surface.
  • Physically-based transparency: One limitation of .opacity is that highly transparent materials are less reflective. Physically-based .transmission provides a more realistic option for thin, transparent surfaces like glass.
  • Advanced reflectivity: More flexible reflectivity for non-metallic materials.

As a result of these complex shading features, MeshPhysicalMaterial has a higher performance cost, per pixel, than other three.js materials. Most effects are disabled by default, and add cost as they are enabled. For best results, always specify an environment map when using this material.

Constructor

MeshPhysicalMaterial( parameters : Object )

parameters - (optional) an object with one or more properties defining the material's appearance. Any property of the material (including any property inherited from Material and MeshStandardMaterial) can be passed in here.

The exception is the property color, which can be passed in as a hexadecimal string and is 0xffffff (white) by default. Color.set( color ) is called internally.

Properties

See the base Material and MeshStandardMaterial classes for common properties.

.clearcoat : Float

Represents the intensity of the clear coat layer, from 0.0 to 1.0. Use clear coat related properties to enable multilayer materials that have a thin translucent layer over the base layer. Default is 0.0.

.clearcoatMap : Texture

The red channel of this texture is multiplied against .clearcoat, for per-pixel control over a coating's intensity. Default is null.

.clearcoatNormalMap : Texture

Can be used to enable independent normals for the clear coat layer. Default is null.

.clearcoatNormalScale : Vector2

How much .clearcoatNormalMap affects the clear coat layer, from (0,0) to (1,1). Default is (1,1).

.clearcoatRoughness : Float

Roughness of the clear coat layer, from 0.0 to 1.0. Default is 0.0.

.clearcoatRoughnessMap : Texture

The green channel of this texture is multiplied against .clearcoatRoughness, for per-pixel control over a coating's roughness. Default is null.

.defines : Object

An object of the form:

{

                                    'STANDARD': ''

                                    'PHYSICAL': '',

                        };

This is used by the WebGLRenderer for selecting shaders.

.ior : Float

Index-of-refraction for non-metallic materials, from 1.0 to 2.333. Default is 1.5.

.reflectivity : Float

Degree of reflectivity, from 0.0 to 1.0. Default is 0.5, which corresponds to an index-of-refraction of 1.5.

This models the reflectivity of non-metallic materials. It has no effect when metalness is 1.0

.sheen : Float

The intensity of the sheen layer, from 0.0 to 1.0. Default is 0.0.

.sheenRoughness : Float

Roughness of the sheen layer, from 0.0 to 1.0. Default is 1.0.

.sheenRoughnessMap : Texture

The alpha channel of this texture is multiplied against .sheenRoughness, for per-pixel control over sheen roughness. Default is null.

.sheenColor : Color

The sheen tint. Default is 0xffffff, white.

.sheenColorMap : Texture

The RGB channels of this texture are multiplied against .sheenColor, for per-pixel control over sheen tint. Default is null.

.specularIntensity : Float

A float that scales the amount of specular reflection for non-metals only. When set to zero, the model is effectively Lambertian. From 0.0 to 1.0. Default is 0.0.

.specularIntensityMap : Texture

The alpha channel of this texture is multiplied against .specularIntensity, for per-pixel control over specular intensity. Default is null.

.specularColor : Color

A Color that tints the specular reflection at normal incidence for non-metals only. Default is 0xffffff, white.

.specularColorMap : Texture

The RGB channels of this texture are multiplied against .specularColor, for per-pixel control over specular color. Default is null.

.transmission : Float

Degree of transmission (or optical transparency), from 0.0 to 1.0. Default is 0.0.

Thin, transparent or semitransparent, plastic or glass materials remain largely reflective even if they are fully transmissive. The transmission property can be used to model these materials.

When the transmission is non-zero, opacity should be set to 1.

.transmissionMap : Texture

The red channel of this texture is multiplied against .transmission, for per-pixel control over optical transparency. Default is null.

Methods

See the base Material and MeshStandardMaterial classes for common methods.

MeshStandardMaterial

Metallic-Roughness workflow is used to create a standard physically based material.

PBR (physically based rendering) has recently become the industry standard in many 3D applications, including Unity, Unreal, and 3D Studio Max.

This approach differs from previous approaches in that it employs a physically correct model for the way light interacts with a surface rather than approximations. Instead of tweaking materials to look good under specific lighting, the idea is to create a material that will react 'correctly' under all lighting scenarios.

In practice, this produces a more accurate and realistic-looking result than the MeshLambertMaterial or MeshPhongMaterial, but it is slightly more computationally expensive.

Shading is calculated in the same way that it is for the MeshPhongMaterial, with a Phong shading model. This calculates shading per pixel (i.e. in the fragment shader, also known as the pixel shader), which produces more accurate results than the Gouraud model used by MeshLambertMaterial, but at the expense of some performance.

It should be noted that when using this material, you should always specify an environment map for the best results.

Constructor

MeshStandardMaterial( parameters : Object )

parameters - (optional) an object with one or more properties defining the material's appearance. Any property of the material (including any property inherited from Material) can be passed in here.

The exception is the property color, which can be passed in as a hexadecimal string and is 0xffffff (white) by default. Color.set( color ) is called internally.

Properties

See the base Material class for common properties.

.alphaMap : Texture

The alpha map is a grayscale texture that controls the surface's opacity (black: fully transparent; white: fully opaque). The default value is null.

Only the texture's colour is used, with the alpha channel ignored if one exists. Due to the extra bit of precision provided for green in DXT-compressed and uncompressed RGB 565 formats, the WebGL renderer will use the green channel when sampling RGB and RGBA textures. Luminance-only and luminance/alpha textures will continue to function normally.

.aoMap : Texture

The red channel of this texture is used as the ambient occlusion map. Default is null. The aoMap requires a second set of UVs.

.aoMapIntensity : Float

Intensity of the ambient occlusion effect. Default is 1. Zero is no occlusion effect.

.bumpMap : Texture

The texture to create a bump map. The black and white values map to the perceived depth in relation to the lights. Bump doesn't actually affect the geometry of the object, only the lighting. If a normal map is defined this will be ignored.

.bumpScale : Float

How much the bump map affects the material. Typical ranges are 0-1. Default is 1.

.color : Color

Color of the material, by default set to white (0xffffff).

.displacementMap : Texture

The displacement map has an effect on the vertices of the mesh. Unlike other maps, which only affect the material's light and shade, the displaced vertices can cast shadows, block other objects, and otherwise function as real geometry. The displacement texture is an image in which the value of each pixel (white being the highest) is mapped against the vertices of the mesh and repositions them.

.displacementScale : Float

How much the displacement map affects the mesh (where black is no displacement, and white is maximum displacement). Without a displacement map set, this value is not applied. Default is 1.

.displacementBias : Float

The offset of the displacement map's values on the mesh's vertices. Without a displacement map set, this value is not applied. Default is 0.

.emissive : Color

Emissive (light) color of the material, essentially a solid color unaffected by other lighting. Default is black.

.emissiveMap : Texture

Set emissive (glow) map. Default is null. The emissive map color is modulated by the emissive color and the emissive intensity. If you have an emissive map, be sure to set the emissive color to something other than black.

.emissiveIntensity : Float

Intensity of the emissive light. Modulates the emissive color. Default is 1.

.envMap : Texture

The environment map. To ensure a physically correct rendering, you should only add environment maps which were preprocessed by PMREMGenerator. Default is null.

.envMapIntensity : Float

Scales the effect of the environment map by multiplying its color.

.flatShading : Boolean

Define whether the material is rendered with flat shading. Default is false.

.isMeshStandardMaterial : Boolean

Read-only flag to check whether a given object is of type MeshStandardMaterial.

.lightMap : Texture

The light map. Default is null. The lightMap requires a second set of UVs.

.lightMapIntensity : Float

Intensity of the baked light. Default is 1.

.map : Texture

The color map. Default is null. The texture map color is modulated by the diffuse .color.

.metalness : Float

How much the material is like a metal. Non-metallic materials such as wood or stone use 0.0, metallic use 1.0, with nothing (usually) in between. Default is 0.0. A value between 0.0 and 1.0 could be used for a rusty metal look. If metalnessMap is also provided, both values are multiplied.

.metalnessMap : Texture

The blue channel of this texture is used to alter the metalness of the material.

.normalMap : Texture

The texture to create a normal map. The RGB values affect the surface normal for each pixel fragment and change the way the color is lit. Normal maps do not change the actual shape of the surface, only the lighting. In case the material has a normal map authored using the left handed convention, the y component of normalScale should be negated to compensate for the different handedness.

.normalMapType : Integer

The type of normal map.

Options are THREE.TangentSpaceNormalMap (default), and THREE.ObjectSpaceNormalMap.

.normalScale : Vector2

How much the normal map affects the material. Typical ranges are 0-1. Default is a Vector2 set to (1,1).

.refractionRatio : Float

The index of refraction (IOR) of air (approximately 1) divided by the index of refraction of the material. It is used with environment mapping modes THREE.CubeRefractionMapping and THREE.EquirectangularRefractionMapping. The refraction ratio should not exceed 1. Default is 0.98.

.roughness : Float

How rough the material appears. 0.0 means a smooth mirror reflection, 1.0 means fully diffuse. Default is 1.0. If roughnessMap is also provided, both values are multiplied.

.roughnessMap : Texture

The green channel of this texture is used to alter the roughness of the material.

.wireframe : Boolean

Render geometry as wireframe. Default is false (i.e. render as flat polygons).

.wireframeLinecap : String

Define appearance of line ends. Possible values are "butt", "round" and "square". Default is 'round'.

This corresponds to the 2D Canvas lineCap property and it is ignored by the WebGL renderer.

.wireframeLinejoin : String

Define appearance of line joints. Possible values are "round", "bevel" and "miter". Default is 'round'.

This corresponds to the 2D Canvas lineJoin property and it is ignored by the WebGL renderer.

.wireframeLinewidth : Float

Controls wireframe thickness. Default is 1.

Due to limitations of the OpenGL Core Profile with the WebGL renderer on most platforms linewidth will always be 1 regardless of the set value.

Methods

See the base Material class for common methods.

PointsMaterial

The default material used by Points.

Code Example

const vertices = [];

for ( let i = 0; i < 10000; i ++ ) {

            const x = THREE.MathUtils.randFloatSpread( 2000 );

            const y = THREE.MathUtils.randFloatSpread( 2000 );

            const z = THREE.MathUtils.randFloatSpread( 2000 );

            vertices.push( x, y, z );

}

const geometry = new THREE.BufferGeometry();

geometry.setAttribute( 'position', new THREE.Float32BufferAttribute( vertices, 3 ) );

const material = new THREE.PointsMaterial( { color: 0x888888 } );

const points = new THREE.Points( geometry, material );

scene.add( points );

Constructor

PointsMaterial( parameters : Object )

parameters - (optional) an object with one or more properties defining the material's appearance. Any property of the material (including any property inherited from Material) can be passed in here.

The exception is the property color, which can be passed in as a hexadecimal string and is 0xffffff (white) by default. Color.set( color ) is called internally.

Properties

See the base Material class for common properties.

.alphaMap : Texture

The alpha map is a grayscale texture that controls the opacity across the surface (black: fully transparent; white: fully opaque). Default is null.

Only the color of the texture is used, ignoring the alpha channel if one exists. For RGB and RGBA textures, the WebGL renderer will use the green channel when sampling this texture due to the extra bit of precision provided for green in DXT-compressed and uncompressed RGB 565 formats. Luminance-only and luminance/alpha textures will also still work as expected.

.color : Color

Color of the material, by default set to white (0xffffff).

.map : Texture

Sets the color of the points using data from a Texture.

.size : Number

Sets the size of the points. Default is 1.0.

Will be capped if it exceeds the hardware dependent parameter

gl.ALIASED_POINT_SIZE_RANGE.

.sizeAttenuation : Boolean

Specify whether points' size is attenuated by the camera depth. (Perspective camera only.) Default is true.