gpt4 book ai didi

javascript - Three.js 三 Angular 形未绘制

转载 作者:行者123 更新时间:2023-11-28 19:46:08 26 4
gpt4 key购买 nike

完整代码如下:

http://jsfiddle.net/YzR33/

基本上,我正在尝试绘制三 Angular 形(并为每个顶点设置颜色),当我设置某些坐标时,它们突然不会被绘制。

// Draw 20 triangles, only 5 show up
for (var i=0; i<20; i++) {
drawTriangle(
[[4, 10], [1, 5 + i], [10, 10]], // coords
[0x00ff00, 0xaa0000 + i*256*100, 0x555555 + i*256*100] // colors
);
}

var triangles = new THREE.Mesh( geometry, material );
scene.add(triangles);
renderer.render(scene, camera);

...

function drawTriangle(coords, colors) {
// Triangle counter
if (typeof this.cnt == 'undefined')
this.cnt = 0;

var p1 = new THREE.Vector3(coords[0][0], coords[0][1], 1);
var p2 = new THREE.Vector3(coords[1][0], coords[1][1], 1);
var p3 = new THREE.Vector3(coords[2][0], coords[2][1], 1);
geometry.vertices.push( p1 );
geometry.vertices.push( p2 );
geometry.vertices.push( p3 );

geometry.faces.push( new THREE.Face3( this.cnt*3, this.cnt*3+1, this.cnt*3+2 ) );

geometry.faces[this.cnt++].vertexColors = [
new THREE.Color(colors[0]),
new THREE.Color(colors[1]),
new THREE.Color(colors[2])
];
}

最佳答案

您正在绘制的一些三 Angular 形是背面的,这是由三 Angular 形法线决定的。将 side: THREE.DoubleSide 添加到您的 Material 中,您将看到所有三 Angular 形。

关于javascript - Three.js 三 Angular 形未绘制,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24254814/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com