GreasedLineRibbon - a non camera facing version of GreasedLine
GreasedLineRibbon
You can use all the features of GreasedLine
except sizeAttenuation
which doesn't make sense to use in non camera facing mode. GreasedLineRibbon
creates ribbon like geometry for the lines. If you want to create a GreasedLineRibbon
just add the ribbonOptions
property to the GreasedLineMeshBuilderOptions
when using the CreateGreasedLine
builder function or to GreasedLineMeshOptions
when creating the GreasedLineRibbon
manually.
Create a GreasedLineRibbon
The easiest, prefered and recommended way to create a GreasedLineRibbon
is to use the CreateGreasedLine
function:
function CreateGreasedLine(name: string, options: GreasedLineMeshBuilderOptions, materialOptions?: Nullable<GreasedLineMaterialBuilderOptions>, scene?: Nullable<Scene>)
The simplest usage is:
const line = BABYLON.CreateGreasedLine("name", { points, ribbonOptions: { } })
GreasedLineMeshBuilderOptions.ribbonOptions
If there is a ribbonOptions
present a non camera facing ribbon like mesh will be created. It's an instance of the GreasedLineRibbon
class. If you don't want to change the default values it's enough to pass an empty object as shown previously.
pointsMode: GreasedLineRibbonPointsMode;direction: Vector3;width: number;facesMode?: GreasedLineRibbonFacesMode;closePath?: boolean;smoothShading?: boolean;
The default values are:
pointsMode = GreasedLineRibbonPointsMode.POINTS_MODE_POINTS;direction = Vector3.UpReadOnly;width = GreasedLineMaterialDefaults.DEFAULT_WIDTH; // 0.1facesMode = GreasedLineRibbonFacesMode.FACES_MODE_SINGLE_SIDED;closePath = false;smoothShading = false;
If you are creating the GreasedLineRibbonMesh
manually you have to take care of setting all the values yourself. In addition you have to set the cameraFacing
option to false
in GreasedLineMaterialOptions
when creating the material manually.
pointsMode
There are two point modes available:
POINTS_MODE_POINTS = 0,POINTS_MODE_PATHS = 1,
In GreasedLineRibbonPointsMode.POINTS_MODE_POINTS
every array of points will become the center (backbone) of the ribbon. The ribbon will be expanded by width / 2
to +direction
and -direction
as well.
In GreasedLineRibbonPointsMode.POINTS_MODE_PATHS
every array of points is one path. These will be used to build one ribbon.
Let's demonstrate both point modes. The gray mesh is the line ribbon itself and the white line is the center (backbone) of it:
Point mode POINTS_MODE_POINTSThe gray mesh is the line ribbon itself and the white lines are the paths which the line ribbon is built between:
Point mode POINTS_MODE_PATHSA simple space track created using POINTS_MODE_PATHS
. The red debug lines shows the paths. Track colors are created using a manually created texture. The red lines shows the paths which defines the edges of the ribbon.
The same space track colorizeds by the colors
property of the GreasedLineMaterial
:
You can have more than two paths to build line ribbons of custom shapes:
Point mode POINTS_MODE_PATHS with more pathsdirection and width
This property is a normalized direction vector of the slope of the line in POINTS_MODE_POINTS
. The line ribbon will be expanded to +direction
and -direction
from the center line defined by points
by a value of width / 2
.
You can change the default width by modifying the value of GreasedLineRibbonMesh.DEFAULT_WIDTH
static property. This will not affect the existing line ribbons.
The widths
option on GreasedLineMaterialBuilderOptions
is not supported in POINTS_MODE_PATHS
because in this mode you define the edges of the ribbon and not the center line.
facesMode
FACES_MODE_SINGLE_SIDED = 0,FACES_MODE_SINGLE_SIDED_NO_BACKFACE_CULLING = 1,FACES_MODE_DOUBLE_SIDED = 2
Controls how the faces are created:
In GreasedLineRibbonFacesMode.FACES_MODE_SINGLE_SIDED
single sided with back face culling. Default value.
In GreasedLineRibbonFacesMode.FACES_MODE_SINGLE_SIDED_NO_BACKFACE_CULLING
single sided without back face culling. Sets backFaceCulling = false
on the material so it affects all line ribbons added to the line ribbon instance.
In GreasedLineRibbonFacesMode.FACES_MODE_DOUBLE_SIDED
extra back faces are created. This doubles the amount of faces of the mesh.
closePath
If true, the line will be closed. Works in both pathMode
s.
smoothShading
If true, normals will be computed when creating the vertex buffers. This results to smooth shading of the mesh. Doesn't work when closePath = true
. colorMode
mustn't be BABYLON.GreasedLineMeshColorMode.COLOR_MODE_SET
and a lightsource must be present of course.