How to create a triangle from 3 points?

Questions
1

Hello, I am wondering how to create a triangle from 3 points in Babylon. I have tried searching in the documentation and what I got is only this https://playground.babylonjs.com/#MVSQWZ#2, but it seems that it can only create a right triangle.

What I am expecting is, for example, to generate a triangle from 3 points, like (0,0,0), (0,0,1), (0, 1, 0), which behaves like a plane created by MeshBuilder.CreatePlane but has only 3 vertices.

Is there any solution?

2

hi @lomirus - welcome to the forum. One way is to do so directly. Here is a demo:
Babylon Basic - Custom Meshes ⋅ Storybook (brianzinn.github.io)

If you spin the camera around then you can see that the backside is not visible in this example. The code looks like this):
react-babylonjs/customMeshes.stories.js at master · brianzinn/react-babylonjs (github.com)

const meshInstance = new Mesh(props.name, scene);

    //Set arrays for positions and indices
    var positions = [
      -5, 2, -3, -7, -2, -3, -3, -2, -3, 5, 2, 3, 7, -2, 3, 3, -2, 3,
    ];
    var indices = [0, 1, 2, 3, 4, 5];
    var colors = [
      1, 0, 0, 1, 1, 0, 0, 1, 1, 0, 0, 1, 0, 1, 0, 0, 0, 1, 1, 0, 0, 1, 0, 1,
    ];

    //Empty array to contain calculated values
    var normals = [];

    var vertexData = new VertexData();
    VertexData.ComputeNormals(positions, indices, normals);

    //Assign positions, indices and normals to vertexData
    vertexData.positions = positions;
    vertexData.indices = indices;
    vertexData.normals = normals;
    vertexData.colors = colors;

    //Apply vertexData to custom mesh
    vertexData.applyToMesh(meshInstance);

    return meshInstance;

If you want a 3d mesh - there is a trick with (if i remember correctly) cylinder with 3 edges.

edit: it was the disc with tessellation - I should have looked at your PG first.

3 Likes
3

Thanks for your answer!

4

Links are dead… 25.09.2024.

5

The docs were moved when they switched off storybook. Here is the new link:
brianzinn.github.io/react-babylonjs/examples/basic/custom-mesh/

You don’t need the second link, because the code is now a tab and you can choose JavaScript/TypeScript. HTH.

1 Like