I’m trying to implement an onscreen joystick to control a 3D avatar’s movement.
The joystick is from Nipplejs
https://github.com/yoannmoinet/nipplejs
The perspective camera is fixed in place and continuously lookAt at the moving avatar
After the character moves a certain distance, the camera will jump to a position behind the character
I’m using joystick’s radian position for the avatar’s Y rotation
However when I push the joystick 90 degrees, the 3D avatar doesn’t move forward, instead it rotates and moves to the right.
And when the avatar rotates towards a different direction, pushing the joystick 90 degrees results in the avatar again changing to a different direction.
I’ve included a drawing showing the fixed joystick and the above situation.
How can I have the avatar’s direction always match the joystick’s rotation / direction?
Thank You!
Related
I want have some very large objects present on canvas, but there seems to be a distance limit of about 2000 and anything further is not visible at all.
Is there a way to disable this option or reassign the border value?
I couldn't find any mention in any documentation.
In the picture I am almost in the center of a ball with radius 4000 and the grey circle in the middle grows or shrinks based on me zooming in or out.
You might be experiencing camera clipping: geometry that gets cuts off when it's to close (near clipping plane) or too far (far clipping plane) from the view frustum (imagine the base section of a pyramid with the center of the camera as the tip).
(Image credits: MithrandirMage - Own work This W3C-unspecified vector image was created with Inkscape.)
You can play with the frustum() or perspective() methods to adjust the near/far clipping distance: which ever makes more sense for your setup
Lets say that I have a player sprite, located at (player.x, player.y). On a mousemove event, I am capturing the cursor's position, which is (e.pageX, e.pageY). In the game, the player will be constantly moving, always towards the direction of the cursor. I am trying to find a way to to rotate the player sprite to always face the mouse cursor, and also move 10 pixels closer to the cursor every game tick. So far, this has me stumped. I have seen many examples of this online, and have tried all of them, but none seem to work. Any help that can be provided would be very much appreciated.
First of all, you must learn the basics of trigonometry. Without this knowledge, you will can't make something like you want.
Center of you image is the center of an circle. Knowing position of center and mouse position, you can calculate the angle. Calculated angle you can use to rotate image.
I am having trouble to get Rectangle position of current Camera view.
I want to create a Rectangle or Wall on the same position as current Camera view (red rectangle). Is there any way to do this?
Thank you
I am not sure I understand you problem, but I think you may have luck using the the Cesium camera's computeViewRectangle function to get the approximate rectangle the camera can see.
Here is the documentation:
https://cesiumjs.org/Cesium/Build/Documentation/Camera.html#computeViewRectangle
I'm using OrbitControls.js to rotate camera around a pivot point. I don't want to limit up/down rotation in any way - I need the camera to "go around" the model ("orbiting" the pivot point).
I tried commenting out the phi limits but then rotating freaks out on top and bottom of the model and acts glitchy for a fraction of a second and then gets back to the limit point anyway.
Any suggestions how to achieve the desired effect?
I think you should use TrackballControls instead of OrbitControls. There is no limitations on rotation in up/down directions.
I have a plane that the camera is looking straight at and am using Trackball Controls to be able to zoom, pan, and rotate the plane. I realize that currently there isn't a way to limit the rotation or pan like can with zoom in the file, but was hoping there is a fix for this.
I'd like to limit the rotation to only a few degrees and not be able to flip the plane in anyway. Also, I'd like to only allow panning when the plane is still visible on the screen. I don't want to allow a user to pan and be able to remove the plane from the window. Is there a quick fix to add to the Trackball Controls or how do I go about setting limits to the rotation and pan? Or is there a better type of control for handling this functionality?