These shapes or meshes are determined by parameters or mathematical data. They include lines, a system of lines, ribbons, tubes, extrusions, lathed shapes and irregular polygons. In the 101 course you will only meet lines and you will just use the MeshBuilder method rather than the older legacy Mesh method. How to create all the parametric shapes using either method and the advantages and disadvantages of both can be found by doing Further Reading.
Lines are a series of line segments in 3D where the end of one line segment is the start of the next segment. Lines are described by a series of points in 3D space.
These three points (0, 0, 0), (0, 1, 1), (0, 1, 0) will form two line segments.
These points are given by position vectors which in Babylon.js are constructed as Vector3 objects and are placed in order in an array to be passed to the CreateLines method.
var myPoints = [];
var point1 = new BABYLON.Vector3(0, 0, 0);
myPoints.push(point1);
var point2 = new BABYLON.Vector3(0, 1, 1);
myPoints.push(point2);
var point3 = new BABYLON.Vector3(0, 1, 0);
myPoints.push(point3);
//or possible the alternative
var myPoints =[
new BABYLON.Vector3(0, 0, 0),
new BABYLON.Vector3(0, 1, 1),
new BABYLON.Vector3(0, 1, 0)
];
The array of points MUST then be passed to CreateLines with the points option
//creates lines
var lines = BABYLON.MeshBuilder.CreateLines("lines", {points: myPoints}, scene);
You can use dashed lines with CreateDashedLines and adding the number of dashes dashNb as an option.
Playground Example of a Spiral from Dashed Lines -
For CreateLines the options are
option | value | default value |
---|---|---|
points | (Vector3[]) array of Vector3, the path of the line REQUIRED | |
updatable | (boolean) true if the mesh is updatable | false |
instance | (LineMesh) an instance of a line mesh to be updated | null |
colors | (Color4[]) array of Color4, each point color | null |
useVertexColor | (boolean) true if the alpha value of the former array must de used | false |
For CreateDashedLines the options are
options | value | default value |
---|---|---|
points | (Vector3[]) array of Vector3, the path of the line REQUIRED | |
dashSize | (number) size of the dashes | 3 |
gapSize | (number) size of the gaps | 1 |
dashBn | (number) intended number of dashes | 200 |
updatable | (boolean) true if the mesh is updatable | false |
instance | (LineMesh) an instance of a line mesh to be updated | null |
Lines and Dashed Lines have an updatable option. When this is true it is possible to alter the data associated with each vertex of the Lines and so alter the path of the Lines. For more information see Updating Vertices.
Lines also have an instance option which means there is an alternative way to update the path of the lines just by passing a new set of points. For this to work the original lines creation must have the updatable option as true and the lines created are passed as the value of the option instance. The number of points in the array MUST stay the same.
Example :
//creates lines
var lines = BABYLON.MeshBuilder.CreateLines("lines", {points: myArray, updatable: true}, scene);
// updates the existing instance of lines : no need for the parameter scene here
lines = BABYLON.MeshBuilder.CreateLines("lines", {points: myNewArray, instance: lines});
Playground Example of a Spiral from Lines -
Most but not all parametric shapes have the instance option and so can have their mesh updated in this way.
In the previous section, about set shapes, you saw that when created they sit on top of each other at the origin. That is often the case with parametric shapes as well. So its time to move on to position meshes where needed and also find out about rotation and scaling. Ready? Sure you are! Position, Rotation and Scaling
How to Create Parametric Shapes with MeshBuilder
How to Create Parametric Shapes Legacy Method
Advantages and Disadvantages