Nice and smooth camera/mouse wheel effect

Hi,

We haven’t exposed the deltaY property in the get event property puzzle but it will be there in the next Verge3D update. :)

Hey brice,
It’s actually pretty simple, see my post and puzzle screen shot here.
https://www.soft8soft.com/topic/verge3d-2-12-1-maintenance-update/#post-14994

I created a simple 240 frame camera animation (with keyframe every 40 frames) and gave the user the option to activate each of the 6 segments of the animation forward or backwards depending on scrolling up or down. Basically vey similar to the example you posted.

I also put an option box where you can change things a bit to where you your scroll wheel will move through the animation frame by frame.

https://cdn.soft8soft.com/AROAJSY2GOEHMOFUVPIOE:04931cc0ad/applications/mousewheel/mousewheel.html

Observations: the default option, scrolling to activate different segments of animation (I had a keyframe every 40 frames) plays rather choppy the first time through but then gets smoother second time around. I remember reading an old thread about ‘prerendering’ onload so the animation plays smoother first time through. Anyone familiar with this please provide your input.

The second option, scrolling through 1 frame at a time, has very jerky playback.
I think now the reason for that might be how I setup the animation (i am not very good at blender or animations in general). I added a ‘track to’ camera constraint (fyi, the camera mode was set to no-controls) to an empty to help keep the camera looking in a general direction as moved it through the scene dropping the occasion keyframe every 40 frames. I never removed the track to constraint. I would imagine that was causing some of the jerky movement. I will create another example but this time ‘bake’ the animation and remove all constraints before exporting.

source puzzles attached

Hi Guys,

I am new to Verge3D and a designer and no coder. But I am also looking for an effect similar to naker.io
I tried some stuff and what I managed to create is an animation starting by mouse wheel scroll, but I was not able to manage to scroll the opposite direction. Also I am very interested in the camera moving effect like you can see at naker.io – I mean the camera moving a littel by moving the cursor over the screen.
And what I am wondering is: how can I implement a WebGl-App like this with scroll events and combine them with scrolling text blocks above.
Is somebody around here who can write me a kind of a template?

Many thanks in advance.

Cheers

@yuri
Is this maybe something you could integrate as a sample in verge3D in general?
Cheers.

wurstseppl wrote:

@gliftek Did you find a way to reproduce the effect yet?

Kind of.
Download this project Gliftek Examples Color Levels COLOR RAMP

Check out the PROCESS_MOUSEWHEEL_DELTA_Y procedure.

If you play with the last value in the equation around .5-1.0 you can change the resolution of the scroll.

I’m trying another way to average a certain msec times worth of scroll.

Interesting topic, keep me in the loop.

Was anybody able to copy naker.io yet?
Anyone out there who can do this as a request for money?