如何在 Babylon JS 中从自定义点创建填充形状

Question

我觉得这个问题的答案隐藏在文档的某个地方，但我正在努力寻找它。

我只是想在数组中定义一些自定义点来创建线（我已经这样做了）然后，因为它们是连接的，所以用颜色填充线的内部并且基本上有一个类似平面的对象（最好是，我可以像往常一样变换和纹理化）。

轮廓形状已经这样定义了(http://www.babylonjs-playground.com/#I22AB#1);

var createScene = function()
{
    // Create Scene
    var scene = new BABYLON.Scene(engine);

    // Create Camera
    var camera = new BABYLON.FreeCamera("camera", new BABYLON.Vector3(0, 10, 0), scene);
    camera.setTarget(BABYLON.Vector3.Zero());
    camera.attachControl(canvas, true);

    // Create Points
    var x = 0;
    var z = 0;
    var points = [
        new BABYLON.Vector3(x - 1, 0, z + 1.5),
        new BABYLON.Vector3(x + 1, 0, z + 1.5),
        new BABYLON.Vector3(x + 1.5, 0, z),
        new BABYLON.Vector3(x + 1, 0, z - 1.5),
        new BABYLON.Vector3(x - 1, 0, z - 1.5),
        new BABYLON.Vector3(x - 1.5, 0, z),
        new BABYLON.Vector3(x - 1, 0, z + 1.5)
    ];

    // Create Hex
    var hex = BABYLON.Mesh.CreateLines("hex", points, scene);
    hex.color = BABYLON.Color3.Black();

    /* Question
        what can I do now to create a custom 2D shape that
        is a single filled plane within these defined points?
    */

    // Done
    return scene;
};

谢谢

Answer 1

Ribbons可以解决你的问题。本质上，丝带允许您定义路径，并且将在这些路径之间绘制三角形以创建网格。您已经定义了路径，并将其命名为 points.

在您的 playground 中添加以下几行就可以了。

var filled_hex = BABYLON.Mesh.CreateRibbon("hex", [points], true, false, 0, scene);
filled_hex.color = BABYLON.Color3.Black();

这是您的更新 playground。

如何在 Babylon JS 中从自定义点创建填充形状

How to Create a Filled Shape from Custom Points in Babylon JS

babylonjs