@zcomponent/three-trail
v1.3.1
Published
Trail component for Mattercraft
Downloads
151
Readme
@zcomponent/three-trail
This package adds support for creating dynamic trails in 3D environments to Mattercraft 3D content creation platform for the web. It allows you to easily add beautiful, customizable trails to any object in your 3D scenes.
Features
- Attaches to any Object3D to create a trail
- Customizable trail properties such as width, color, length, and decay
- Various attenuation functions for trail width
- Support for textures and alpha maps
- Seamlessly integrates with the Mattercraft 3D environment
Getting Started
To use the Trail component in your Mattercraft project:
- Right-click on any Object3D node in your scene's Hierarchy.
- Navigate to the "Trails" submenu.
- Select "Trail" to add it to your object.
Key Properties
width
: Width of the trailcolor
: Color of the traillength
: Length of the traildecay
: How fast the trail fades awayattenuationFunction
: Function to control trail width attenuation
Material Properties
opacity
: Opacity of the trailalphaTest
: Alpha test value for transparencysizeAttenuation
: Whether to use size attenuationtransparent
: Whether the material is transparentblending
: Blending mode for the trail
Texture Properties
map
: A texture to paint along the trailalphaMap
: A texture to use as alpha along the trailrepeat
: Texture tiling for map and alphaMap
Example Usage
Here's a simple example of how to use a custom attenuation function with the Trail:
import { Behavior, ContextManager } from '@zcomponent/core';
import { Trail } from '@zcomponent/three-trail';
/**
* @zbehavior
*/
export class MyTrailBehavior extends Behavior<Trail> {
constructor(contextManager: ContextManager, instance: Trail, props: {}) {
super(contextManager, instance);
// Override the attenuation function with a custom one
this.instance.attenuation = width => Math.sin(width * Math.PI);
}
}