8

我需要制作网站截图。我尝试使用 html2canvas 和所有它，它正在工作。但问题是我正在使用 THREE.WebGLRenderer 和 THREE.CSS3DRenderer（用于 webgl 中的 html）......所以当我制作屏幕截图时，它只从 WebGLRenderer 制作图像。CSS3DRenderer 被忽略，我不知道如何从两个渲染器制作屏幕截图。我正在使用这个解决方案： 使用 html2canvas 截取 <body> 并将 img 存储为 JS var

4

3 回答 3

11

你可以使用这个代码var Render=new THREE.WebGLRenderer({antialias: true, preserveDrawingBuffer: true});

和一个功能onclick打印：

$("#btn_print").click(function() {
                window.open( Render.domElement.toDataURL("image/png"), "Final");
                return false;
            });

在线示例：http: //develoteca.com/Panel/点击按钮打印

关键是：对象 WebGLRenderer 中的 {antialias: true, preserveDrawingBuffer: true}

，问候。

访问：http: //develoteca.com

于 2013-12-27T16:14:16.650 回答
2

尝试理解这个 chrome 扩展Screen Capture的代码。安装后，您可以在 ~/.config/chromium/Default/Extensions/<extention_id_in_link> 中找到代码。

它使用chrome.tabs.captureVisibleTab。请参阅文档。由于它是 chrome 浏览器提供的用于与其选项卡交互的 API，因此它仅适用于 Google Chrome。

于 2014-07-04T05:51:40.193 回答
1

由于文件保护程序 js lib ，我实现了此功能

 <script type="text/javascript" src="js/filesaver.js"></script>

$("#btn_print").click(function() {
    Render.domElement.toBlob(function(blob) {
        saveAs(blob, "Final");
    });
});

我希望这有帮助 ！

于 2014-11-01T08:17:59.653 回答