Reset camera rotation when using universal-controls - three.js

I was puzzled with resetting camera rotation, I wrote a simple component to reset camera rotation, the code is published at aframe demo
I add 'click' event listener to the blue box, if the box was clicked. then, i would reset camera rotation to {x:0,y:0,z:0}. but, as you see, there is no effects. I step in to my component and i found my code did work, but something set the rotation back after my function.
I have tried:
use look-controls instead of universal-control. in this way, it works on the PC browser but my mobile phone.
use a newer aframe-extras lib, v3.1.0. and I got an error 'Cannot read property x of undefined' at aframe-extras.js:5265.
Anyone hints?

You could try using a wrapper entity around the camera and modifying that. Or if that doesn't work...
Since the controls continually update the camera rotation on each frame, any rotations you set may be overwritten by the camera controls. You could perhaps try pausing the camera (el.pause()), setting the rotation (el.setAttribute), and resuming the camera (el.play()), but no guarantees that will work.
If it doesn't, you could maybe fork any control implementations and add some sort of logic to allow you to manually update the rotation.

Related

Panning in React Three Fiber

When I right click, I can move my camera up and down. By default, when my model loads, half of its body is out of the frame. I want to move the camera down, so the whole body fits in the frame. Is there a setting to do this? I’ve tried using camera position but that didn’t work. Thank you!
when I come across cases like this I do this:
try to scale down the object first, so that I can see the whole picture
add axesHelpers to object or scene, to figure out which direction should I move to
change position of camera accordingly.

How to change the camera in three.js / editor using only scripts?

How to change the type of camera used in three.js/editor? I want to do this using scripts, and not using the add camera button (Add → Orthographic Camera). I try to announce the camera again, but I can't. I'm trying to check the view of the main camera using the function (console. log(camera)) — the console shows that the camera has changed. But, when you click the PLAY button, the view remains the same as it was. Thank you for your help and feedback, I am very grateful for this!
It is not possible to do what you are looking for since cameras are handled within the editor. You can't use scripts to change the type of camera used for rendering.
In general, there is no full support for orthographic cameras in the editor. For example the editor's controls only support perspective cameras as well as the app player that playbacks exported/published applications. However, there is a feature request at GitHub that tracks the improvement of orthographic camera support:
https://github.com/mrdoob/three.js/issues/16008

Threejs Rotating object with device orientation control

I am trying to achieve an effect similar to one of the cardboard app examples that Google has put out with their cardboard app called the 'exhibit'. I have a 3D object that I want to rotate using device orientation control. Right now with just the device orientation control, I can view the 3D object but when I turn around, the camera rotates (it seems) causing the object to fall out of view until I turn all the way back around to where it was in the beginning. In other words the camera seems to rotate in its axis as I look around. What I want is to be able to rotate the object as I turn around.
Kinda like this example http://threejs.org/examples/#misc_controls_orbit except I want to rotate using device orientation control.
Any idea how I can incorporate this feature?
Thank you for your assistance.
The answer to my own question for future seekers is to replace camera in
controls = new THREE.DeviceOrientationControls(camera, true);
with the 3D object you are trying to rotate.

Unity 4.3 Play animation on hit

I'm currently building a 2d platformer and encountered a few problems.
My player has a script so that when the player hits a cube with a rigid body, the cube can be pushed. When the character pushes the object, the regular walking animation is displayed.
I want to play the pushing animation at that moment but cant seem to fix it. I read a lot of topics on the internet about the difference between unity new Animator editor and the older versions.
Is there a simple way to trigger the animation on hit, and how do I have to add it in the Animator? Also with witch states should it be connected?
Found it on google, maybe it will help
http://unity3d.com/learn/tutorials/modules/beginner/2d/2d-overview
He uses a Layer for the animation of the cannon so he animates regardless of the body animation.

Newer Threejs version and mouse over

Im trying to use last threejs version to load a Collada Loader. Furthermore, I just want to make a mouse over events.
I've been reading (and analyzing a lot of examples) about this on related forum, there is a problem about intersectObjects (this function makes possible mouse over evet).
Question is simple: How can I code mouse over events on pieces of my model?
Here is my example but It is not using the latest version of the threejs library.
Nothing else at the moment, I think It is so hard to begin with this library, there isn't so much documentation...
My root issue is when mouse is out of canvas, threejs detects mouse over some piece of my model and through the event... I think if I update threejs this may be fixed
Thank you!!!
As far as I can see you already implemented intersectObjects.Try using this on your canvas:
position : absolute,
top : 0px
Seems to me that you dont use the right mousePosition for the calculation. Try using the relative mousePosition of the canvas and not of the document. And I would not check for intersection on every render call. Maybe on a mouseMove event or on an interval.

Resources