在立方体的录影纹理

时间:2014-06-30 12:30:35

标签: javascript three.js textures

尝试在立方体上放置一个简单的视频作为纹理,结果就是什么:)

video = document.createElement('video');
video.width = 320;
video.height = 320;
video.autoplay = true;
video.loop = true;
video.src = 'video.mp4'


var videoTexture = new THREE.Texture(video);
videoTexture.needsupdate = true;


  var cube = new THREE.Mesh(new THREE.BoxGeometry( 10, 10, 10, 1, 1, 1 ), new THREE.MeshBasicMaterial({ map: videoTexture }));
  scene.add(cube);

如果我添加color: '#fff'而不是map: videoTexture,我会看到一个白色正方形,所以立方体正在添加,所以它与视频有关吗?

1 个答案:

答案 0 :(得分:0)

你有迹象表明视频正在播放吗?您还需要检查render()功能:

if ( video.readyState === video.HAVE_ENOUGH_DATA ) {

    if ( videoTexture ) videoTexture.needsUpdate = true;

}

对于质量/速度,您还可以将这些添加到您的定义中:

videoTexture.minFilter = THREE.LinearFilter;
videoTexture.magFilter = THREE.LinearFilter;
videoTexture.format = THREE.RGBFormat;
videoTexture.generateMipmaps = false;