可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试):

问题:

I need to make screenshot of website. I tried using html2canvas and all and it's working. But problem is i'm using THREE.WebGLRenderer and THREE.CSS3DRenderer (for html in webgl)... So when I make screenshot it makes images only from WebGLRenderer. CSS3DRenderer is ignored and I don't know how to make screenshot image from both renderers. I'm using this solution: Take screenshot of <body> with html2canvas and store img as JS var

回答1:

you can use this code var Render=new THREE.WebGLRenderer({antialias: true, preserveDrawingBuffer: true});

and a function onclick print:

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

Example online: http://develoteca.com/Panel/ clic on button Print

The key is: {antialias: true, preserveDrawingBuffer: true} in object WebGLRenderer

,regards.

visit:http://develoteca.com

回答2:

Try understanding the code of this chrome extension Screen Capture. You can find the code in ~/.config/chromium/Default/Extensions/<extention_id_in_link> after installing it.

It uses chrome.tabs.captureVisibleTab. Refer the documentation. As it's an API provided by chrome browser to interact with its tabs it works only on Google Chrome.

回答3:

I implemented this feature thanks to the file saver js lib

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

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

I hope this helps !