How can I create a graphic canvas with 2D objects animated in 3D space?
I came across this site and fell in love with the background animation,
particularly the points connected to each other, animating in a 3D space.
(<canvas id="bg" width="1920" height="995"></canvas>) I am new to canvas
animation, and from the research I've done so far, I do not know what path
I should start down to achieve a similar background animation for my
project. So far, I have looked into Paper.js and plain Canvas and its JS
API.
Here are the specifications I have:
Ability to make 'canvas' (not literally <canvas>, but the graphic canvas.
I am not opposed to any particular graphic wrapper).
Ability to make 'canvas' responsive
Round points (2D circles) navigating in 3D space (ability to spin objects
on an axis is a plus, animating in a helix is an extra plus.)
Instantiable modules of these Round Point sets
Ability to animate these modules on specific events (click, hover, etc)
Nice to haves:
Vector graphics
Something similar to what I want to achieve can be viewed here.
I know all of what I am trying to do will require pieces to a whole (JS
graphics library such as Paper.js, custom JS classes, etc), but I would
just like to know what others have had success with.
Thanks!
 
No comments:
Post a Comment