search

tengbao / vanta

Animated 3D backgrounds for your website
http://vantajs.com/
MIT License
5.46k stars 1.03k forks source link

Can I add animation to Canvas element? #191

Open mclaurie opened 2 months ago

mclaurie commented 2 months ago

Hello,

I am a newbie. I know the animation can be inserted into "Div" element, but can I add it to "Canvas" element? I tried below but was not successful:

<body> <canvas id="ele"> </canvas> <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r134/three.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.clouds.min.js"></script> <script> VANTA.CLOUDS('#ele'); </script> </body>

Thank you!

SheeetFace commented 1 month ago

@mclaurie Most likely, the reason why VANTA doesn't work with <canvas> elements, but only with <div> elements, probably has to do with architectural decisions and library usability.

As for animations and <canvas>, you can insert animations into the <canvas> element using various libraries such as Three.js, or write your own animations in pure JavaScript.