Offset camera so object is displayed off to the side

This topic has 11 replies, 3 voices, and was last updated 1 year ago by saalemv3d.

Viewing 12 posts - 1 through 12 (of 12 total)

Author

Posts
2022-08-24 at 6:14 am #55183

mjdesigner
Participant

Hi, I’ve read all I could find on this topic, but I still can’t make it work (please see attached JPG).

I’d like to have my product (a tall shape) off to one side of the viewer, so I have room for a menu, which includes the CyberFox 2D canvas, so I need to keep the iFrame full-width.

I tried the .app.camera.SetView.Offset — keeping the camera pointed to the product is perfect, but depending on the browser width, the view gets distorted.

I’m not a javascript programmer, any script or help that can make this work would be kindly appreciated. Thanks!

Attachments:
You must be logged in to view attached files.

2022-08-24 at 8:15 am #55200
kdv
Participant
apps.camera.filmOffset = -10 or any other numeric value, but it’s hard to find the logic to set the camera view in the middle of the left part of a page independant of its width )))

When using setViewOffset you should take into account the v3d canvas size (it can be scaled and different from the window size), but not some random numbers…
```
function setCameraViewOffset() {
    const width = app.renderer.domElement.width; // the actual v3d canvas width
    const height = app.renderer.domElement.height; //the actual v3d canvas height
    const offsetX = -(width / 4); // the middle of the left half of a page
    const offsetY = 0;
    app.camera.setViewOffset(width, height, offsetX, offsetY, width, height);
}
setCameraViewOffset();
window.onresize = function() {
    setCameraViewOffset();
};
```
https://v3d.net/aa7

Puzzles and JS. Fast and expensive.

If you don’t see the meaning in something it primarily means that you just don’t see it but not the absence of meaning at all.
2022-08-25 at 2:31 am #55210

mjdesigner
Participant

Your script works perfectly – very cool and very useful. Thank you!

2023-03-13 at 11:21 am #61020

saalemv3d
Participant

Hi @kdv,

How can we animate setViewOffset instead of just jumping?
For example, animation like tween camera or look at.

2023-03-13 at 11:26 am #61021

kdv
Participant

https://www.soft8soft.com/docs/manual/en/puzzles/Animation.html#animate_param

Puzzles and JS. Fast and expensive.

If you don’t see the meaning in something it primarily means that you just don’t see it but not the absence of meaning at all.

2023-03-13 at 11:50 am #61022

saalemv3d
Participant

Hi @kdv,

Thanks for the reply.

We do not have a puzzle for the setViewOffset. So, I executed the code in “on update animation” which is not working. Screenshot attached. Can you take a look at it?

Thank you

Attachments:
You must be logged in to view attached files.

2023-03-13 at 12:06 pm #61024

kdv
Participant

First, in you code offsetX and offsetY are always 0. What did you expected?
Second, what do you want exactly? It’s quite strange to use the animation puzzle on the wheel event…

Puzzles and JS. Fast and expensive.

If you don’t see the meaning in something it primarily means that you just don’t see it but not the absence of meaning at all.

2023-03-14 at 2:59 am #61036

saalemv3d
Participant

Thanks for the reply.

We have a panning option in the model. So after panning, bring the model back to the center of the page when the user scrolls up.

Actually, offsetX and offsetY with value 0 always keep it in the center when I scroll up but need to give it a smooth animation instead of just jumping.

2023-03-14 at 6:36 am #61038

kdv
Participant

Do you want to center the model with the wheel up action? Than there is no need in the “animate param” puzzle. this puzzle is supposed to be used once (ex. on the click) to animate from one value to another…

In any case, you won’t do it via puzzles only. There is no puzzle to read/write the camera’s view offset…

Puzzles and JS. Fast and expensive.

If you don’t see the meaning in something it primarily means that you just don’t see it but not the absence of meaning at all.

2023-03-14 at 7:16 am #61047

saalemv3d
Participant

Do you want to center the model with the wheel up action? Yes, and the above puzzle is working fine. I just wanted to give some smooth animation to setViewOffset and instead of jumping instantly, it should happen in (ex. 1sec).

2023-03-14 at 7:33 am #61052

kdv
Participant

The above puzzle just sets the zero offset on every wheel up event. You could click somewhere with the same result… To animate the view offset you need to read the current view offset and interpolate it to the zero view offset in time.

Puzzles and JS. Fast and expensive.

If you don’t see the meaning in something it primarily means that you just don’t see it but not the absence of meaning at all.

2023-03-22 at 11:31 am #61358

saalemv3d
Participant

Thanks for the instructions.
I played other ways around to achieve what I was looking for.
Author

Posts