threejs繪制多邊形3

 

threejs繪制多邊形，

threejs多邊形繪制方法：

 

var points = [
    new THREE.Vector2(10,10), 
    new THREE.Vector2(300, 10), 
    new THREE.Vector2(300, 30), 
    new THREE.Vector2(260, 30), 
    new THREE.Vector2(260, 120), 
    new THREE.Vector2(300, 120), 
    new THREE.Vector2(300, 140),
    new THREE.Vector2(10, 140),
    new THREE.Vector2(10, 120),
    new THREE.Vector2(50, 120),
    new THREE.Vector2(50, 30),
    new THREE.Vector2(10, 30)
    
] 

// 通過頂點定義輪廓 
var shape = new THREE.Shape(points);
// shape可以理解為一個需要填充輪廓 
// 所謂填充：ShapeGeometry算法利用頂點計算出三角面face3數據填充輪廓 
var geometry = new THREE.ShapeGeometry(shape, 25); 
var triangleMaterial = new THREE.MeshPhongMaterial({ 
    color: 0x0000ff, 
    side: THREE.DoubleSide, 
    //兩面可見 
    wireframe: true, 
}); 
//材質對象 

// var triangleMaterial = new THREE.MeshBasicMaterial({ vertexColors: THREE.FaceColors, side:THREE.DoubleSide,overdraw: 0.99 });

var mesh = new THREE.Mesh(geometry, triangleMaterial); 
//網格模型對象 
scene.add(mesh); 

 

 

 

 

 

 

 

 

##################################