🧵#Scroll+Orbit

Hi,

which Needle Engine version are you using and which component are you using for Scrolling?

Also what exactly doesn't work anymore?

It’s the most recent version of Needle Engine, and I’m using the scroll techniques on the Scrollytelling example. When I combine the scroll scripts, the timeline, and the orbit controls, the orbit controls stop working entirely

Is the timeline animation perhaps animating the Camera? (or is disabling the OrbitControls component, perhaps it's also the ScrollTimeline script you're using that disables the OrbitControls component?)

There isnt a reason why they shouldnt work together except if one overrides the other due to e.g. animations in your scene maybe. Have you checked your browser console?

I’m sorry. I didn’t see you reply. The console doesn’t tell me anything about the orbit controls when the timeline is running. How could I check to make sure it doesn’t get disabled?

You can check the Timeline Animation (Animations can enable/disable components) or your ScrollFollow script from the samples that you're using (Click the Blue link at the top of the component in Unity).

We also have a core ScrollFollow component in Needle Engine since 4.10, it definitely doesnt touch OrbitControls. There's another sample in the Samples Window (Scrollytelling and Cursor Interaction).

<@214209096721629184> here's a quick example. It's also possible that your 3D canvas/OrbitControls doesnt receive any input events if it's blocked by HTML elements above (not sure about your exact setup). You can try it with the index.html here (and the OrbitScroll package for the Unity scene)

It's also possible to give OrbitControls a different HTML element to receive events from (by default it's using the canvas element inside <needle-engine>) but it depends on how your website is structured or what you're planning to create which solution is the best option 🙂

Note that I've disabled "Zoom" in the OrbitControls component to avoid scrolling on the page scroll both the page and zoom with OrbitControls.

https://orbitscroll-z23hmxbz1sxvfp-1hhkmp.needle.run/

Here's another different quick layout test: https://orbitscroll-z23hmxbz1sxvfp-sptc6.needle.run/ (enabled Zoom here again and moved <needle-engine> somewhere else on the page and made it sticky)

Thank you so much for this! This is incredibly helpful! This fixed what I was trying to get setup. I appreciate all the information you got for me. I think my html was blocking it before