DEV Community

Cover image for Pointcloud effect in Three.js

Pointcloud effect in Three.js

Maniflames on May 25, 2019

Not too long ago I built a site that served as a submission for a small competition. To spice it up, I decided to add some Three.js. An effect that...
Collapse
 
manutastic profile image
Manu

As someone who's wanted to dive into three.js but has never used it so far, I think you did a great job of introducing it and getting me excited about trying it out. This is a seriously cool effect and you explained it well 😊

Collapse
 
maniflames profile image
Maniflames

Mission accomplished in that case 😄

I hope you get the chance to try it out! I'm still exploring myself and can promise you it's worth your time. Thanks a lot for reading my post 😊

Collapse
 
wamaitha profile image
wamaitha

How did you embed the model as a cdn?

Collapse
 
maniflames profile image
Maniflames • Edited

In this case the cdn is a feature of glitch. You upload assets into a project by clicking on 'assets' in the explorer on the left. You can drag any file type into there (you might need to compress your .ob file I used compress-or-die) and it will upload the file to glitch's cdn. If you click on the file, glitch will show you the url of the file. If you don't use glitch you should be able to use the path to your model.

Let me know whether you can find the stuff I'm talking about! Maybe I could help out by making a GIF, not gonna lie this feature isn't too intuitive 😅

Collapse
 
wamaitha profile image
wamaitha

a gif would be super helpful if you don't mind

Thread Thread
 
maniflames profile image
Maniflames

So the thing is actually a little bit too big for a GIF so I made video instead.
I hope this helps, thanks for your patience!

Thread Thread
 
wamaitha profile image
wamaitha • Edited

Thanks alot... I managed to add more complex animations like Austin's site have a look:

wamaitha.netlify.com

I highly appreciate your input.

Thread Thread
 
maniflames profile image
Maniflames

Super nice!! The morphs look really smooth, thanks for sharing your work 😁🔥💪🏽

Collapse
 
ericguizzetti profile image
Eric Guizzetti

Great work man! If you ever want to play with a Leica #RTC360 hit me up. I'd love too see something from that scanner online...

Collapse
 
maniflames profile image
Maniflames

Thanks!

Collapse
 
leongeldsch profile image
Leon Geldschläger

Great introduction!
The one thing that I'm still wondering about, is how to create a morph effect between two point clouds. Let me know if you have any idea on how to get started with that!