How to make interactive 3d animation on the site?

Question

JavaScript

Advise a solution, there is a simple task: an elementary geometric figure, say a cube or a ball, with hovere I want to rotate it twice in given directions (for example, 90 to the left and 90 to x) and change the color, for example, which methods are not particularly labor-intensive and maximal cross browser? I’m just a redneck on the web in general, but I really want to, the project is not commercial, if possible done on my own))

svg animation, the easiest in terms of changing object properties (colors for example) but without a visual editor with rotation it’s somehow difficult to get.
gif - the dumbest, but the most working and easiest way to
flash - zashkvar =)
canvas - perhaps the coolest, but also the most difficult, I'm not in the subject at all, maybe there are libraries with similar functionality?
webGL is a good option, right? But you need to learn js for 10 years, don't you know there is no visual editor? =)
blender4web - very simple and beautiful, but not cross browser at all.
What option would you suggest?

Answer 1

https://threejs.org/
https://threejs.org/examples/

Answer 2

It depends on how elementary the figure is. If there is some kind of cube, then css can be dispensed with. Look for something similar to what you want somewhere on the code pen, and file it to the desired one if you don't want to bother.

Answer 3

Probably the simplest thing you can think of is to use Verge3D . They include a visual editor, similar to puzzles. Throwing things like triggering a procedural animation or changing colors is literally a matter of seconds.