2014-01-08 157 views
0

有人可以解释一下为什么在下面的代码中没有可见的粒子? 按照教程,一切似乎没问题。three.js中的粒子

(function() { 

var camera, scene, renderer; 

init(); 
animate(); 

function init() { 

    scene = new THREE.Scene(); 
    var SCREEN_WIDTH = window.innerWidth, SCREEN_HEIGHT = window.innerHeight; 
    var VIEW_ANGLE = 45, ASPECT = SCREEN_WIDTH/SCREEN_HEIGHT, NEAR = 0.1, FAR = 20000; 
    camera = new THREE.PerspectiveCamera(VIEW_ANGLE, ASPECT, NEAR, FAR); 
    scene.add(camera); 
    camera.position.set(2,2,10); 
    camera.lookAt(scene.position); 
    console.log(scene.position); 

    var geometry = new THREE.CubeGeometry(1,1,1); 
    var material = new THREE.MeshBasicMaterial({ color: 0x00ff00 }); 
    var cube = new THREE.Mesh(geometry, material); 
    scene.add(cube); 

    var pGeometry = new THREE.Geometry(); 
    for (var p = 0; p < 2000; p++) { 
     var particle = new THREE.Vector3(Math.random() * 50 - 25, Math.random() * 50 - 25, Math.random() * 50 - 25); 
     pGeometry.vertices.push(particle); 
    } 
    var pMaterial = new THREE.ParticleBasicMaterial({ color: 0xfff, size: 1 }); 
    var pSystem = new THREE.ParticleSystem(pGeometry, pMaterial); 
    scene.add(pSystem); 

    renderer = new THREE.CanvasRenderer(); 
    renderer.setSize(window.innerWidth, window.innerHeight); 

    document.body.appendChild(renderer.domElement); 

} 

function animate() { 
    requestAnimationFrame(animate); 
    renderer.render(scene, camera); 

} 

})(); 

fiddle

回答

0

此外,作为一个侧面说明,作为这个答案的时候,IE11的WebGL的实现则与点和浆纱他们的问题。 Three.js着色器中的粒子使用点来绘制粒子,所以在IE11中,你会看到非常小的方块,如果你不注意,你可能根本看不到任何东西;)

我知道在下一个版本的IE(即将更新),这是固定的,并且不仅允许您更改点大小,还可以使用它们的位图。