바빌론 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입니다.

놀이터에서 다음 줄을 추가하면 트릭을 만들었습니다.

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

여기는 업데이트 된 playground입니다.