Added reset button
This commit is contained in:
parent
d15740ec3a
commit
a04f30dc49
|
@ -65,20 +65,8 @@ PointerCamera.prototype.update = function() {
|
|||
|
||||
if (Tools.norm2(Tools.diff(this.position, this.new_position)) < 0.01 &&
|
||||
Tools.norm2(Tools.diff(this.target, this.new_target)) < 0.01) {
|
||||
// this.position = this.new_position.clone();
|
||||
// this.target = this.new_target.clone();
|
||||
this.moving = false;
|
||||
|
||||
// Update phi and theta so that return to reality does not hurt
|
||||
var forward = Tools.diff(this.target, this.position);
|
||||
forward.normalize();
|
||||
|
||||
this.phi = Math.asin(forward.y);
|
||||
|
||||
// Don't know why this line works... But thanks Thierry-san and
|
||||
// Bastien because it seems to work...
|
||||
this.theta = Math.atan2(forward.x, forward.z);
|
||||
|
||||
this.anglesFromVectors();
|
||||
}
|
||||
|
||||
// Hermite polynom version
|
||||
|
@ -124,17 +112,11 @@ PointerCamera.prototype.update = function() {
|
|||
this.phi = Math.min(Math.max(-(Math.PI/2-0.1),this.phi), Math.PI/2-0.1);
|
||||
this.theta = ((this.theta - Math.PI) % (2*Math.PI)) + Math.PI;
|
||||
|
||||
// Compute vectors (position and target)
|
||||
this.vectorsFromAngles();
|
||||
|
||||
// Update with events
|
||||
var delta = 0.1;
|
||||
|
||||
// Update direction
|
||||
this.forward.y = Math.sin(this.phi);
|
||||
|
||||
var cos = Math.cos(this.phi);
|
||||
this.forward.z = cos * Math.cos(this.theta);
|
||||
this.forward.x = cos * Math.sin(this.theta);
|
||||
this.forward.normalize();
|
||||
|
||||
// Update
|
||||
var forward = this.forward.clone();
|
||||
forward.multiplyScalar(400.0 * delta);
|
||||
var left = this.up.clone();
|
||||
|
@ -152,8 +134,35 @@ PointerCamera.prototype.update = function() {
|
|||
this.target = this.position.clone();
|
||||
this.target.add(forward);
|
||||
}
|
||||
}
|
||||
|
||||
PointerCamera.prototype.reset = function() {
|
||||
this.position.copy(new THREE.Vector3(-8.849933489419644, 9.050627639459208, 0.6192960680432451));
|
||||
this.target.copy(new THREE.Vector3(17.945323228767702, -15.156828589982375, -16.585740412769756));
|
||||
this.anglesFromVectors();
|
||||
}
|
||||
|
||||
PointerCamera.prototype.vectorsFromAngles = function() {
|
||||
// Update direction
|
||||
this.forward.y = Math.sin(this.phi);
|
||||
|
||||
var cos = Math.cos(this.phi);
|
||||
this.forward.z = cos * Math.cos(this.theta);
|
||||
this.forward.x = cos * Math.sin(this.theta);
|
||||
this.forward.normalize();
|
||||
|
||||
}
|
||||
|
||||
PointerCamera.prototype.anglesFromVectors = function() {
|
||||
// Update phi and theta so that return to reality does not hurt
|
||||
var forward = Tools.diff(this.target, this.position);
|
||||
forward.normalize();
|
||||
|
||||
this.phi = Math.asin(forward.y);
|
||||
|
||||
// Don't know why this line works... But thanks Thierry-san and
|
||||
// Bastien because it seems to work...
|
||||
this.theta = Math.atan2(forward.x, forward.z);
|
||||
}
|
||||
|
||||
PointerCamera.prototype.move = function(otherCamera) {
|
||||
|
|
|
@ -5,13 +5,17 @@
|
|||
camera with the arrow keys of your keyboard, and change the
|
||||
angle of the camera by dragging and dropping the scene around
|
||||
it (you can also use your numpad, 2 to look lower, 8 to look
|
||||
higher, 4 to look on the left and 6 to look on the right).
|
||||
higher, 4 to look on the left and 6 to look on the right, but
|
||||
if you're more comfortable with non-numpad keys, you can also
|
||||
use i for up, j for left, k for down, and l for right).
|
||||
</p>
|
||||
<p>
|
||||
Recommended views are displayed with a transparent red screen.
|
||||
By clicking on this screen, your camera will move to the
|
||||
recommended viewpoint.
|
||||
Recommended views are displayed with a transparent red arrow.
|
||||
They disappear when you come closer to them, and you can
|
||||
automatically move to them by clicking on them. You can reset
|
||||
the camera at anytime by clicking on the reset button.
|
||||
</p>
|
||||
<button id="reset" style="margin-bottom:10px">Reset camera</button>
|
||||
<div style="border-width:1px; border-style: solid;" id="container"></div>
|
||||
#
|
||||
</section>
|
||||
|
|
|
@ -16,6 +16,9 @@ init();
|
|||
animate();
|
||||
|
||||
function init() {
|
||||
// Add the listener on the button
|
||||
document.getElementById('reset').onclick = function() { cameras.mainCamera().reset(); };
|
||||
|
||||
// on initialise le moteur de rendu
|
||||
container = document.getElementById('container');
|
||||
container.style.height = container_size.height + 'px';
|
||||
|
@ -51,8 +54,7 @@ function init() {
|
|||
// on initialise la camera que l’on place ensuite sur la scène
|
||||
var camera1 = new PointerCamera(50, container_size.width / container_size.height, 0.01, 100000, container);
|
||||
camera1.speed = 0.001;
|
||||
camera1.position = new THREE.Vector3(0,2,0);
|
||||
camera1.phi = -0.1;
|
||||
camera1.reset();
|
||||
scene.add(camera1);
|
||||
cameras.push(camera1);
|
||||
|
||||
|
|
Loading…
Reference in New Issue