4

我有一个粒子,它是一个图像。当我旋转粒子时,它会在后面留下一个圆圈。我如何摆脱这个奇怪的圈子?

小提琴在这里:http: //jsfiddle.net/zUvsp/137/

代码:

var camera, scene, renderer, material, img, texture, particle;
init();
animate();

function init() {
  scene = new THREE.Scene();
  camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 1, 10000);
  camera.position.z = 1000;
  scene.add(camera);

  img = new Image();
  texture = new THREE.Texture(img);

  img.onload = function() {
    texture.needsUpdate = true;
    makeParticle();
  };
  img.src = "http://www.atalasoft.com/cs/blogs/davidcilley/files/PNG_Mask.png";

  renderer = new THREE.CanvasRenderer();
  renderer.setSize(window.innerWidth, window.innerHeight);
  document.body.appendChild(renderer.domElement);
}

function makeParticle() {
  material = new THREE.ParticleBasicMaterial({
    map: texture,
    blending: THREE.AdditiveBlending,
  });
  // make the particle
  particle = new THREE.Particle(material);
  particle.scale.x = particle.scale.y = 1;
  particle.position.x = 10;
  scene.add(particle);
}

function animate() {
  requestAnimationFrame(animate);
  renderer.render(scene, camera);
  particle.rotation.z += 0.01
}
4

1 回答 1

0

-编辑我测试了我的理论,这不是问题,不要浪费你的时间

只是一个猜测,但我认为这可能与您从不同的域加载纹理 .png 有关。尝试使用从运行代码的同一域加载的图像,看看是否能解决问题。

我认为这个问题可能与由于 Cross-origin 问题而导致three.js 无法访问纹理上的像素数据有关。

于 2013-06-06T22:11:02.903 回答