我正在使用three.js尝试使用线框渲染模型全白,但我遇到了问题。当我尝试渲染模型时,它是纯黑色。如果我尝试将白色材质指定给模型,则无效。如果我尝试将模型的几何和材质组合成网格,然后在场景中渲染,我会在three.js缩小文件中看到f.makeGroups错误。完整的错误是
TypeError: f.makeGroups is not a function
我用来呈现它的代码如下:
var SCREEN_WIDTH = 800;
var SCREEN_HEIGHT = 600;
var blue = 0x03106D;
var white = 0xFFFFFF;
var black = 0x000000;
var orange = 0xFF6600;
// this function is executed on each animation frame
function animate(){
// render
renderer.render(scene, camera);
// request new frame
requestAnimationFrame(function(){
animate();
});
}
// renderer
var renderer = new THREE.WebGLRenderer();
renderer.setSize(SCREEN_WIDTH, SCREEN_HEIGHT);
renderer.setClearColor(0xFFFFFF, 1);
document.body.appendChild(renderer.domElement);
// camera
var camera = new THREE.PerspectiveCamera(45, SCREEN_WIDTH / SCREEN_HEIGHT, 1, 1000);
camera.position.z = 700;
var facemat = new THREE.MeshBasicMaterial( { color: white, opacity: 1.0, shading: THREE.FlatShading } );
var wiremat = new THREE.MeshBasicMaterial( { color: blue, opacity: 1.0, wireframe: true, wireframeLinewidth: 1.0 } );
var Material = [facemat,wiremat];
// scene
var scene = new THREE.Scene();
// cube
var vrmlLoader = new THREE.VRMLLoader();
vrmlLoader.addEventListener('load', function (event) {
var object = event.content;
var mesh = new THREE.Mesh(object, Material);
scene.add(mesh);
});
vrmlLoader.load("ship.wrl");
// start animation
animate();
我还确认我的模型正在使用three.js editor
答案 0 :(得分:0)
var mesh = new THREE.Mesh( object, [facemat,wiremat] )
?你做到了吗? :)您无法将数组作为材质传递。我猜WebGLRenderer
可以提供更好的错误消息,但是......
另外,我已经看到这种模式已经成为时间(我不知道它来自哪里?):
function animate(){
renderer.render(scene, camera);
requestAnimationFrame(function(){
animate();
});
}
应该就是这样:
function animate(){
renderer.render(scene, camera);
requestAnimationFrame(animate);
}