Question

我有一个带有对象的three.js场景。我让用户拍摄画布上绘制的内容的快照。

虽然，我希望所有快照都有另一个对象。但是，此对象永远不会出现在画布上。所以我想我会在我的场景中拥有这个物体，但是我会把它放得很远，所以它永远不可见。但是当用户点击下载快照的链接时，我会将对象带到一个可见的位置几毫秒，当画布的快照完成后，我会再次将其移动到远处。

    document.getElementById('download').addEventListener('click', function() {
      appearMesh();
      downloadCanvas(this , "screenshot");
      disappearMesh();

    }, false);

    function downloadCanvas(link,  filename) {

      link.href = document.getElementsByTagName("canvas")[0].toDataURL();
      link.download = filename;

    };

但这并不起作用：http://jsfiddle.net/95t964o0/21/

图片中没有任何内容。

有什么想法吗？

感谢

Answer 1

我认为你应该在移动对象后调用渲染：

function appearMesh(){
    meshToAppear.position.x = 0;
    renderer.render( scene, camera );
}
function disappearMesh(){
    meshToAppear.position.x = 1000;
    renderer.render( scene, camera );
}

添加对象并立即获取canvas的快照 - three.js

1 个答案: