three.js - 如何更改three.js THREE.Face3 颜色
问题描述
我刚刚创建了一个使用THREE.Face3和three.js绘制三角形的示例。
这是我的代码片段
var scene, camera, renderer;
var cube;
var controls;
function initScene() {
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera(80, window.innerWidth / window.innerHeight, 0.1, 1000);
camera.position.z = 30;
renderer = new THREE.WebGLRenderer({ alpha: true });
renderer.setSize(window.innerWidth, window.innerHeight);
controls = new THREE.OrbitControls(camera);
controls.update();
document.body.appendChild(renderer.domElement);
}
function render() {
requestAnimationFrame(render);
renderer.render(scene, camera);
}
function draw() {
var material = new THREE.MeshStandardMaterial( { color : 0x00cc00, side: THREE.DoubleSide } );
//create a triangular geometry
var geometry = new THREE.Geometry();
geometry.vertices.push( new THREE.Vector3( -5, -5, 0 ) );
geometry.vertices.push( new THREE.Vector3( 5, -5, 0 ) );
geometry.vertices.push( new THREE.Vector3( 5, 5, 0 ) );
//create a new face using vertices 0, 1, 2
var normal = new THREE.Vector3( 0, 1, 0 ); //optional
var color = new THREE.Color( 0xffaa00 ); //optional
var materialIndex = 0; //optional
var face = new THREE.Face3( 0, 1, 2);
//add the face to the geometry's faces array
geometry.faces.push( face );
//the face normals and vertex normals can be calculated automatically if not supplied above
geometry.computeFaceNormals();
geometry.computeVertexNormals();
scene.add( new THREE.Mesh( geometry, material ) );
}
initScene();
draw();
render();
body {
margin: 0;
width: 100%;
height: 100%;
overflow: hidden;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/94/three.min.js"></script>
<script src="https://cdn.rawgit.com/mrdoob/three.js/master/examples/js/controls/OrbitControls.js"></script>
我参考了three.js Face3文档中的示例代码,我认为示例代码尝试设置颜色为0x00cc00或0xffaa00,但我的示例中三角形的颜色是黑色。
如何改变它?
解决方案
推荐阅读
- reactjs - 如何在单击状态下更改所选项目的 css -- React Native
- python-3.x - plt.plot() 在尝试绘制熊猫系列或数据框时无限运行
- django - Django CreateView中的自动完成地址填写
- rust - 我可以从 Actix-Web 中间件获取响应正文并对其进行修改吗?
- macos - 可以使用在 64 位 macOS 上运行的 carbon api
- c++ - 如何编写自定义删除器来处理前向声明的类型
- node.js - 节点猫鼬更新两个集合
- c# - 用户控件在运行时未添加到 TableLayoutPanel
- c# - 如何使用 C# 中的“System.Runtime.Serialization.Json”类反序列化带有字符串数组的 JSON?
- c# - RegEx 不适用于 DocuSign 进行文本验证