Take screenshot of three.js
Take screenshot of three.js
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/92/three.min.js"></script>
<script src="https://rawgit.com/mrdoob/three.js/r92/examples/js/loaders/ColladaLoader.js"></script>
<!DOCTYPE html>
<html lang="en">
<head>
<title>three.js webgl - collada</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<style>
body {
background:#777;
padding:0;
margin:0;
overflow:hidden;
}
#info {
position: absolute;
top: 0px;
width: 100%;
color: #ffffff;
padding: 5px;
font-family:Monospace;
font-size:13px;
text-align:center;
}
a {
color: #ffffff;
}
</style>
</head>
<body>
<div id="container"></div>
<script src="../build/three.js"></script>
<script src="js/loaders/ColladaLoader.js"></script>
<script>
var container, stats, clock;
var camera, scene, renderer, trooper;
init();
animate();
function init() {
container = document.getElementById( 'container' );
camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 0.1, 2000 );
camera.position.set( 10, 5, -5 );
camera.lookAt( new THREE.Vector3( 0, 3, 0 ) );
scene = new THREE.Scene();
scene.background = new THREE.Color(0xffffff);
// loading manager
var loadingManager = new THREE.LoadingManager( function() {
scene.add( trooper );
// Draw bounding box
const box = new THREE.BoxHelper(trooper, 0xff0000);
scene.add(box);
// Manual bounding box
const boundingBox = new THREE.Box3().setFromObject(trooper);
const size = boundingBox.getSize();
const center = boundingBox.getCenter();
const geometry = new THREE.BoxGeometry(size.x, size.y, size.z);
const material = new THREE.MeshBasicMaterial({ wireframe: true, color: 0x0000ff });
const box2 = new THREE.Mesh(geometry, material);
box2.position.set(center.x, center.y,...