Forum

[SOLVED]Camera animation doesn't completely work with Camera limits systems.

19 September 2018 07:46
Hi.
I try to create to 3D object viewer system.
so I wanna play camera animation from wherever but it doesn't work with Camera Limits systems.
Please look at this picture.


if you don't show the picture please click the little icon you can see it.
(Black is Acting right now, I want to do like a purple!)

Actually, The camera is trying to enter point but they don't enter here then stack.
I want to move to the camera like a purple line.

The Chevrolet-3d-car-configurator is very good
I want to the same thing.
https://chevrolet.alghandi.com/new-vehicles/2018-camaro/

Please teach me how did you do that?
Thank you!
19 September 2018 18:34
I think if there are complex camera movements, such as animating the camera along a curve, I would animate this in Blender and then play the resulting camera animation in Blend4Web. You can find many online examples of how to do such animations, like this:
Animating camera along a curve while tracking second object


However, if there are more simple camera movements, I would do this directly in B4W, like in this example: Camera Animation (Code Snippet)
21 September 2018 09:07
hi, Thank you for the answer to me.
First of all, I can not use path animation because the start point doesn't sure.
I guess that solution is not working for me. so I want to transform to goal location on only use camera located inside the limit area. I don't want camera going outside limit area.
Thank you.
21 September 2018 09:09
\hi, Thank you for the answer to me.
First of all, I can not use path animation because the start point doesn't sure.
I guess that solution is not working for me. so I want to transform to goal location on only use camera located inside the limit area. I don't want camera going outside limit area.
Thank you.
22 September 2018 21:14
Hmm… but how is it that you don't know your starting point if you just want a camera move? You said you wanted something like in the Camaro scene. But that is just a video, as far as I can see, without user interaction. You always know your start and end points in such a situation.

Do you want to make a scene where the camera hovers in circles around a car, but the user can take over the camera at any time, and when the user releases the camera again, it goes back to auto-hovering?

Here is one such scene: https://customise.toyota.com.au/camry/

This is very well made. Difficult, but you'd still have your starting points - because the starting point is wherever the user left off the camera. You can always read it with the API.
24 September 2018 15:48
we had to fight with the same problem:

in b4w, the camera transition lerps in a linear path, which makes the target camera hit the camera limits and it bugs out.

the b4w code documentation states that this transition should only be used for static cameras, unfortunately the nodes do not say this. (https://www.blend4web.com/api_doc/module-camera_anim.html#.move_camera_to_point)

what the camaro example does is lerp in a circular way around the car, so it does not hit the camera limits.

see the attachement for a 2d example

———————————————————

we implemented a code solution for this, which allows us to make these transitions via code.

to do this, you need to
- get the camera start(current) and end position and (use the transform module)
- calculate the difference in distance (m_vec3.length), phi and theta angles (m_vec3.angle)
- update each frame (using main.set_render_callback()) and rotate the cam towards the end position using
cam.rotate_camera and cam.target_set_distance


i guessit is a feature request to make this the native camera transition for target cameras
26 September 2018 08:43
Thank you for the answer to us.

I'm sorry to delay to response.



we had to fight with the same problem:

in b4w, the camera transition lerps in a linear path, which makes the target camera hit the camera limits and it bugs out.


That problem is the same as my issues.

to do this, you need to
- get the camera start(current) and end position and (use the transform module)
- calculate the difference in distance (m_vec3.length), phi and theta angles (m_vec3.angle)
- update each frame (using main.set_render_callback()) and rotate the cam towards the end position using
cam.rotate_camera and cam.target_set_distance


You already fixed this problem?!
could you give me the sample source code if you have source code or something a sample?

i guessit is a feature request to make this the native camera transition for target cameras

I think so, I will post that into the feature request form.
Thank you!
27 September 2018 11:33
just found out that there is camera_anim.rotate_camera

https://www.blend4web.com/api_doc/module-camera_anim.html#.rotate_camera

this makes things easier.

i will have to update my own code before i can upload anythign
27 September 2018 13:22
Thank you answer for me

I'm waiting your update
Please give to me code if you have done fixed this problem.
15 October 2018 13:49
our code is huge, i tried to extract the code for the camera transitions:

i cannot test it like this, i hope you can make something of it

/*converts camera and target positions to angle & distance values*/
function vectorsToRelRotation(camPos, tgtPos){
var ret = {};

var difference = m_vec3.create();
m_vec3.subtract(camPos, tgtPos, difference);

ret.dist = m_vec3.length(difference);

ret.phi = Math.atan2(difference[0],difference[1]); //flat angle around z axis

var flatVec = m_vec3.create();
m_vec3.set(difference[0], difference[1],0, flatVec);
ret.theta = m_vec3.angle(flatVec, difference); //up / down angle
if(difference[2] < 0) ret.theta *= -1; //add sign because angle is absolute

return ret;
}
//start a camera Transition
function startTransition(cameraName, targetName, duration){
var activeCamera = m_scenes.get_active_camera();
var camPos_Start = m_cam.get_translation(activeCamera);
camTgt_Start = m_cam.target_get_pivot(activeCamera);

var cameraObj = m_scenes.get_object_by_name(cameraName);
var camPos_Dest = m_cam.get_translation(cameraObj);

var targeObj = m_scenes.get_object_by_name(targetName);
camTgt_Dest = m_trans.get_translation(targeObj);

camRot_Start = vectorsToRelRotation(camPos_Start, camTgt_Start);
camRot_Dest = vectorsToRelRotation(camPos_Dest , camTgt_Dest);

var phiDiff = camRot_Dest.phi - camRot_Start.phi;
if(phiDiff > Math.PI)phiDiff -= Math.PI*2; //take shorter path
if(phiDiff < -Math.PI)phiDiff += Math.PI*2; //take shorter path
var thetaDiff = camRot_Dest.theta - camRot_Start.theta;

m_cam_anim.rotate_camera(activeCamera, phiDiff, thetaDiff, duration)

m_time.animate(camRot_Start.dist, camRot_Dest.dist, duration, function(value){
m_cam.target_set_distance(activeCamera, value);
});
}


it should work by calling startTransition ("camera_1", "target_1", 3000); duration is in ms
 
Please register or log in to leave a reply.