Help with 3D charts (points, grid, painting its bottom, shadders)

Questions
, , ,
1

Hello, how are you doing?

I’m here trying to make some 3d FFT graphics using Babylon.

I’ve already tried visJS, in it 3D graphics modules… But I couldn’t go so far with that.

What I’m trying to achieve is an FFT 3D graphic, something like that:
cascata-geral

I have already a playground with a “Hello World”. Cedric helped me with that. But I’m new here, and I don’t know what could be the next step: https://playground.babylonjs.com/#S7U8U8#2 I tried adding the grid, and I couldn’t achieve that.

I’m trying to follow this example. But it has some crazy information that I still can’t understand.

Some things that would help me a lot…

  • How to make the grid and the points ‘talk’? When I try to reduce the number of labels on the x-axis, the coordinates get lost by the scene. You can see it on the playground: #E3XJMU#99. (I can just post 2 links because I’m a new user.)

  • How to fill the bottom part of the points with a gradient, as the gif I showed you there at the beginning? Like if I would make a line in the place of the dots and fill in the bottom of it.

But I don’t know, I think it also could be a lot of line bars side by side to make the effect I wich. Do you have any new ideas?

Any kind of help will be welcome!
Best regards dear Babylons,
Matheus

2

My Hello World:

The playground I mentioned on the main topic: https://www.babylonjs-playground.com/#E3XJMU#99

image
image928×857 125 KB

3

There is wonderful library for this - Babyplots - A 3D Plotting Library

image
image1920×998 200 KB

3 Likes
4

Thanks for sharing.
I’ll have a look at that…

5

I was trying with ThreeJS also, and there I achieved something like that:

This is an option with the use of InstancedMesh.

I tried Babyplots, but it still does’t have what I want.