Improve furniture preview (#5328)

* Improve furniture preview

* improve calc method

* camera.aspectいらないことに気付いた

* refactor & go camera far away

* 対角線の長さで計算するように

* 対角線の計算にhypot()を使用

Co-Authored-By: Aya Morisawa <AyaMorisawa4869@gmail.com>
This commit is contained in:
Oni-Men 2019-08-22 18:34:15 +09:00 committed by syuilo
parent 45897dd137
commit 0d3efaeb2e

View File

@ -10,7 +10,8 @@ export default Vue.extend({
data() { data() {
return { return {
selected: null, selected: null,
objectHeight: 0 objectHeight: 0,
orbitRadius: 5
}; };
}, },
@ -57,9 +58,9 @@ export default Vue.extend({
const timer = Date.now() * 0.0004; const timer = Date.now() * 0.0004;
requestAnimationFrame(render); requestAnimationFrame(render);
camera.position.y = 2 + this.objectHeight / 2; camera.position.y = Math.sin(Math.PI / 6) * this.orbitRadius; // Math.PI / 6 => 30deg
camera.position.z = Math.cos(timer) * 10; camera.position.z = Math.cos(timer) * this.orbitRadius;
camera.position.x = Math.sin(timer) * 10; camera.position.x = Math.sin(timer) * this.orbitRadius;
camera.lookAt(new THREE.Vector3(0, this.objectHeight / 2, 0)); camera.lookAt(new THREE.Vector3(0, this.objectHeight / 2, 0));
renderer.render(scene, camera); renderer.render(scene, camera);
}; };
@ -89,6 +90,13 @@ export default Vue.extend({
}); });
const objectBoundingBox = new THREE.Box3().setFromObject(obj); const objectBoundingBox = new THREE.Box3().setFromObject(obj);
this.objectHeight = objectBoundingBox.max.y - objectBoundingBox.min.y; this.objectHeight = objectBoundingBox.max.y - objectBoundingBox.min.y;
const objectWidth = objectBoundingBox.max.x - objectBoundingBox.min.x;
const objectDepth = objectBoundingBox.max.z - objectBoundingBox.min.z;
const horizontal = Math.hypot(objectWidth, objectDepth) / camera.aspect;
this.orbitRadius = Math.max(horizontal, this.objectHeight) * camera.zoom * 0.625 / Math.tan(camera.fov * 0.5 * (Math.PI / 180));
scene.add(obj); scene.add(obj);
}; };