Skip to main content

Material

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 );

Examples

[example:misc_controls_fly misc / controls / fly]
[example:webgl_buffergeometry_drawrange WebGL / BufferGeometry / drawrange]
[example:webgl_buffergeometry_points WebGL / BufferGeometry / points]
[example:webgl_buffergeometry_points_interleaved WebGL / BufferGeometry / points / interleaved]
[example:webgl_camera WebGL / camera ]
[example:webgl_geometry_convex WebGL / geometry / convex]
[example:webgl_geometry_shapes WebGL / geometry / shapes]
[example:webgl_interactive_raycasting_points WebGL / interactive / raycasting / points]
[example:webgl_multiple_elements_text WebGL / multiple / elements / text]
[example:webgl_points_billboards WebGL / points / billboards]
[example:webgl_points_dynamic WebGL / points / dynamic]
[example:webgl_points_sprites WebGL / points / sprites]

Constructor

PointsMaterial

function PointsMaterial( parameters: Object ): void;  

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

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;  

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

fog

fog: Boolean;  

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

map

map: Texture;  

Sets the color of the points using data from a Texture. May optionally include an alpha channel, typically combined with .transparent or .alphaTest.

size

size: Number;  

Defines the size of the points in pixels. Default is 1.0.
Will be capped if it exceeds the hardware dependent parameter gl.ALIASED_POINT_SIZE_RANGE.

sizeAttenuation

sizeAttenuation: Boolean;  

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

Methods

See the base Material class for common methods.

Source

src/materials/PointsMaterial.js