Hello Im having problems to try to remove the white space above the dot wave effect.
How can I have only the effect without the white space above?
This example, have the height of the canvas with 937px, but the effect show at the bottom, not a the top, without the white space.
Thank you very much
Best regards
Nuno
Well, it’s just a matter of where you place the camera in 3D space. E.g. if you replace
camera.position.set(0,355,122);
with
camera.position.set(0,0,100);
the effect should be in the middle.
BTW: The codepen uses CanvasRenderer which was removed quite a while ago. It’s best to implement the example based on WebGL. It looks like so:
Hello, thanks, Its perfect.
There is a way the effect of the curve isnt so large in the front. The balls in the front go to far top and to far bottom. I would like them to bounce just a little.
Thank you very much.
Nuno
The vertex displacement is done in the animation loop which should make it easy to control the form of the wave. In the following fiddle, I’ve just updated the code from the example with a small addition that ensures the strength of the wave increases the more away points are located from the camera.
Hello again Mugen87, Thank you very much
I need to create something like this, the form of the wave must not be to large, in order to stay inside a div, like this image.
Im using the codepen file because its closer to what I need.
Sorry but you should have all resources that are necessary to solve this issue by yourself. If not, I suggest you take some time and study the basics of three.js and the related code.
Hello Mugen87,
Thank you for your help.
I used your code width another aproach of html and css and I solve the problem.
Thank you
Nuno
