javascript - Threejs 给圆柱体着色

标签 javascript three.js

我正在尝试用巧克力色 0xd2691e 绘制一个圆柱体,但是当我使用时:

var cylinder = new THREE.Mesh(new THREE.CylinderGeometry(100, 100, 100, 100, 50, false), new THREE.MeshNormalMaterial({ color: 0xd2691e }));

它不会改变颜色。当我使用时

var cylinder = new THREE.Mesh(new THREE.CylinderGeometry(100, 100, 100, 100, 50, false), new THREE.MeshBasicMaterial({ color: 0xd2691e }));

它确实会改变颜色,但顶面的颜色与侧面的颜色相同,因此它最终会像 Blob 一样,而不会显示圆柱体 3D 形状。

我检查了this question它确实会随机改变脸部的颜色,但我想要一些简单的方法来区分顶部和侧面的颜色。

最佳答案

您应该使用MeshLambertMaterial。另外,请确保场景有灯光,否则它不会显示。

var scene = new THREE.Scene();

var cylinder = new THREE.Mesh(new THREE.CylinderGeometry(100, 100, 100, 100, 50, false), new THREE.MeshLambertMaterial({ color: 0xd2691e }));
scene.add( cylinder );

var light = new THREE.PointLight( 0xffffff );
light.position.z = 200;
scene.add( light );

关于javascript - Threejs 给圆柱体着色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20794536/

相关文章:

javascript - 运行基本的 Three.js

javascript - 如何从二进制 int 中获取百分比,其中每一位代表 x 百分比?

javascript - 根据名称选择jquery中的输入字段

javascript - 在回调函数中可观察 - Angular 2

javascript - Three.js setFromRotationMatrix 旋转超过 90 度时的奇怪行为

javascript - 需要 threejs AnimationClip 示例

javascript - 如何将变量改成函数名?

javascript - URL随React Router更改但组件未渲染?

javascript - 无法打开所选对象的指向 url

javascript - Three.js透明背景根本不起作用