Основы 3d рисовать кубик Рубика

Question

Я хотел бы нарисовать кубик Рубика на HTML-элементе canvas с некоторой точки зрения, но у меня никогда не было опыта работы с трехмерной графикой, перспективами и т. Д., Поэтому я ищу все полезные ресурсы для достижения этой цели.Единственная полезная ссылка, которую я нашел, для этой демонстрации:

http://oos.moxiecode.com/js_canvas/3d_cube/index.html

Answer 1

Вы, конечно, можете создавать трехмерные модели с canvas, используя библиотеки webGL или трехмерные javascript, но я бы лично использовал вместо этого преобразования и переводы CSS3, если вы хотите создать куб Rubix (обещаю, что это будет МНОГО МЕНЬШЕ код). Проверьте это, и вы будете вдохновлены:

http://www.paulrhayes.com/2009-07/animated-css3-cube-interface-using-3d-transforms/

В этом демонстрационном примере используются линейные повороты, но если вы используете повороты с ускорением, то повороты будут выглядеть намного более естественными.

Answer 2

Я написал это некоторое время назад

http://www.pascarello.com/canvas/rubikscube/

Есть проблемы, когда вы начинаете смешивать цвета, но вы можете играть с кодом.