I'm having a bit of trouble trying to figure out how to keep on object tracking a surface in my Three.js application
I have a large 3D surface/track/maze in which my object is allowed to move
Arrow keys control heading/rotate and accelerate/decelerate
Now I need to figure out how to keep the object on the surface -
Object should be able to 'drive' NSEW & Front/Back
Any hints gratefully accepted
I use the lib to manage the movements http://threejsdoc.appspot.com/doc/three.js/src.source/extras/controls/FirstPersonControls.js.html
and to keep it on the floor, I used cannon.js [http://cannonjs.org/] for physics.
Related
I got an unity project where object is meant to be moving with mouse cursor. The object moves fine, but when the object is still, it starts to float towards the camera that Ray-casts. I would like that the object doesn't float towards camera.
I couldn't find any reason for objects behavior.
I'm quite a novice who's had issues with gameobjects following cursors myself.
But could you try freezing the Y position in the Rigidbody and ensure gravity is unchecked?
More of a workaround if it even works.
Also I believe it's better practice to use rigidbody.position than transform.position. Try this:
public Rigidbody rigidbody;
void Update()
{
rigidbody.position = Camera.main.ScreenToWorldPoint(new Vector3(Input.mousePosition.x, Input.mousePosition.y, -Camera.main.transform.position.z));
}
What is happening here is when you send a ray and you get a hit result using hit.point it gives the exact location of the tris on the object it is hitting. Lets say the object is centered in the world (Vector3.zero). Ray is hitting a tris that is different than the position zero. Just because the object is in x:0y:0z:0 doesnt mean all the tris on the object is located at the same coordinates.
You get the coordinates of the hit.point, they are probably closer than the object center position, therefore the object is updating its center position to the hit.point location. And it does that every frame moving the object closer to camera.
You might want to try sending a ray from screen to world position. You can use custom vector length which would help to keep the object in the same depth you like.
Unity Docs Screen to World
I am having a human body object and what I want is that my code should open a popup whenever I click on any of the specified body parts such as eyes, nose, arms, etc. The object is a single compiled .obj file and I'm unable to figure out as to how should I attach an event listener to the multiple body parts. Any kind of help is much appreciated!
PS: - I am also using orbit controls to handle the zoom and rotation of object.
Thanks in advance..
To solve this issue, it's necessary to design your model in a way such that individual components like arms, eyes etc. are independent 3D objects grouped together to build a more complex asset. This is something you have to ensure during the design phase with a tool like Blender.
In the next step export to glTF instead of OBJ, load the model with THREE.GLTFLoader into your app and then perform a recursive raycasting with the entire asset via:
raycaster.intersectObject( gltf.scene, true, intersects );
By executing this code in a pointermove or pointerdown event listener you can find out whether the user interacts with the model or not.
Notice that three.js has no system to directly assign event listeners to 3D objects. You have to use a different solution like raycasting for this.
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.
I was working with my three.js project in which I loads few '.obj ' files in to the scene using 'OBJMTLLoader.js'.
I implemented mouse touch and keyboard events so that I can navigate each objects through the entire scene.
But I need to detect collisions so that when two objects collide, the navigation need to stop in the collided direction. i.e. an object should not get over the other.
I successfully implemented the above for key events by emitting ray to all sides of the object. But the same method doesn't work properly for mouse and touch events.
I also tried to implement 'physi.js', but it seems obj files can't be loaded in 'Physijs.Scene'.
Do anyone know what to be done to implement this..?
Finally I obtained the solution, using the physi.js itself. I made physijs box mesh of desired sizes and added my obj models to it.I made the meshes visible property to false. And made those meshes to collide. The objects will move along with the meshes.
I am working on a program, that uses THREE.RollControls, when the user goes too far away from the center of the screen, they tend to get lost, so I am working on creating a function that reorients them, facing the center of the scene.
What I had intened to do was simply call the following:
camera.lookAt(scene.position)
However, this has no affect. From what I was reading on different stack overflow questions specifically this:
ThreeJS camera.lookAt() has no effect, is there something I'm doing wrong?
It seems like their solution was to do the camera position change using the controls, rather then changing the camera itself.
I do not believe there is any 'Target' in the Roll Controls, so I don't know how I can reset where the camera is looking at based on a THREE.Vector3() Is there a simple way to do this, or will I basically have to:
So far I have 'attempted' to do the follow:
- Calculate the difference of position of the camera with the position of the scene.
- Normalize this vector
- Subtract it from the direction forward of the camera
- use this vector in controls.forward.add(thisVector)
but this doesn't do at all what I want (probably because I have no idea what I'm doing)
Thank you in advance for your time!
Isaac
The same thing bugged me too about the RollControls but I took a different approach in solving the problem. Since the controls are in the example code (in r55) you can modify the controls, as they are not part of the core library. You can see my modifications at http://www.virtuality.gr/AGG/EaZD-WebGL/js/three.js/examples/js/controls/RollControls.js
I introduced a local variable called mouseLook because I could not use the this.mouseLook. I initialized it to false and I only make it true when there is a button press i.e. when navigating in the scene. That solved my problem.