add controls & window resize

This commit is contained in:
yinmb 2021-02-07 14:57:44 +08:00 committed by Gogs
parent 8e2bf6a40b
commit 3b800592cf
3 changed files with 1234 additions and 3 deletions

View File

@ -10,6 +10,7 @@
</head> </head>
<body> <body>
<script src="lib/three.js"></script> <script src="lib/three.js"></script>
<script src="lib/OrbitControls.js"></script>
<script src="js/loader.js"></script> <script src="js/loader.js"></script>
<script src="js/main.js"></script> <script src="js/main.js"></script>
</body> </body>

View File

@ -14,6 +14,11 @@ renderer.setSize(window.innerWidth, window.innerHeight);
renderer.setClearColor(0xffffff); renderer.setClearColor(0xffffff);
document.body.appendChild(renderer.domElement); document.body.appendChild(renderer.domElement);
window.addEventListener('resize', onWindowResize);
// 相机控制
var controls = new THREE.OrbitControls(camera, renderer.domElement);
// 加载模型数据 // 加载模型数据
const loader = new THREE.FileLoader(); const loader = new THREE.FileLoader();
loader.load( loader.load(
@ -26,8 +31,7 @@ loader.load(
box.expandByScalar(10000); box.expandByScalar(10000);
var cameraPos = new THREE.Vector3(box.min.x, box.min.y, box.max.z); var cameraPos = new THREE.Vector3(box.min.x, box.min.y, box.max.z);
camera.position.copy(cameraPos); camera.position.copy(cameraPos);
camera.lookAt(box.getCenter()); controls.target = box.getCenter();
camera.updateMatrixWorld();
scene.add(bimScene); scene.add(bimScene);
}, },
function(xhr) function(xhr)
@ -38,10 +42,19 @@ loader.load(
{ {
console.error('An error happened'); console.error('An error happened');
} }
) );
function onWindowResize()
{
camera.aspect = window.innerWidth / window.innerHeight;
camera.updateProjectionMatrix();
renderer.setSize(window.innerWidth, window.innerHeight);
}
function animate() { function animate() {
requestAnimationFrame( animate ); requestAnimationFrame( animate );
controls.update();
renderer.render( scene, camera ); renderer.render( scene, camera );
} }

File diff suppressed because it is too large Load Diff