Module @zcomponent/three-trail - v1.3.1-beta.1

@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.

  • 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

To use the Trail component in your Mattercraft project:

  1. Right-click on any Object3D node in your scene's Hierarchy.
  2. Navigate to the "Trails" submenu.
  3. Select "Trail" to add it to your object.
  • width: Width of the trail
  • color: Color of the trail
  • length: Length of the trail
  • decay: How fast the trail fades away
  • attenuationFunction: Function to control trail width attenuation
  • opacity: Opacity of the trail
  • alphaTest: Alpha test value for transparency
  • sizeAttenuation: Whether to use size attenuation
  • transparent: Whether the material is transparent
  • blending: Blending mode for the trail
  • map: A texture to paint along the trail
  • alphaMap: A texture to use as alpha along the trail
  • repeat: Texture tiling for map and alphaMap

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