Question: Rotation through scrolling on page and camera damping?

Tagged: damping, orbitControls, rotation, scroll, speed

This topic has 4 replies, 3 voices, and was last updated 5 years, 7 months ago by Yuri Kovelenov.

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

Author

Posts
2019-04-02 at 6:22 pm #13512

Monokultur-Studio
Customer

Hey everyone, my first post!

I’m still evaluating Verge3D for a few of my future projects and have two questions: In one of the projects I try to implement a 3D-model on my website where the camera rotates around the vertical axis when you scroll down the webpage. So the rotation has to be dependent of the position from the container/iframe on the webpage. A good example is the 3D-truck on this page: https://panic.com/transmit/

Is that possible through puzzles? It’s a neat little feature with a huge visual impact.

I’m also trying to enable damping and rotation speed for the camera and to control the factors. I know how to do that with the standart orbitControls of vanilla Three.js but not with Verge3D. Can I add something to “function autoRotateCamera” in the visual_logic.js? I think damping would be a great addition to the “autorotate camera” puzzle!

I already looked in the docs but couldn’t find anything that worked for me… so any help is greatly appreaciated!

2019-04-03 at 6:55 am #13525

Yuri Kovelenov
Staff

Hi and welcome! :)

Verge3D is based on Three.js and exposes its API via v3d namespace. So if you’re already familiar with Three.js, then you can just implement custom features even if they are not available in Puzzles.

Chief 3D Verger | LinkedIn | Twitter

2019-04-03 at 10:17 am #13538
Monokultur-Studio
Customer
Ok thanks for your answere!

Where do I implement those custom features? In the “my_awesome_app.js” in the function runCode(app) {} section? Cause I tried this:
```
function runCode(app) {
controls = new v3d.OrbitControls(camera, renderer.domElement);
    //controls = new THREE.OrbitControls(camera, renderer.domElement);
            controls.enableDamping = true;
            controls.dampingFactor = 2.0;
}
```
But this didn’t work. Is it because it interferes with the blender camera set to “orbit mode” or is there another place where i have to implement stuff like this?
2019-04-03 at 10:22 am #13539

elk
Customer

Take a look at the documentation here;

https://www.soft8soft.com/docs/manual/en/introduction/Using-JavaScript.html#Method_2_Versatile

You can add your functions in prepareExternalInterface , runCode will be run before the entire scene is initialized(If I remember correctly), but code in prepareExternalInterface needs to be triggered.

Hope this helps

ahh, and yeah, what Yuri says below ;) I missed the new statement :S

2019-04-03 at 10:23 am #13540

Yuri Kovelenov
Staff

The camera controls are enabled by default, so you can access it simply through app.controls
Here are more methods available via app method
https://www.soft8soft.com/docs/api/en/extras/App.html

Chief 3D Verger | LinkedIn | Twitter
Author

Posts