3D 绘制魔方的基础知识
我想在 html canvas 元素上用一些视角绘制魔方，但我从未有过 3d 图形、视角等方面的经验，所以我正在寻找所有有用的资源来实现这一目标。我发现的唯一有用的链接是这个演示：
I'd like to draw a Rubik's Cube on html canvas element with some perspective, but I've never had any experience with 3d graphics, perspective etc. so I'm looking for all helpful resources to achieve this. The only helpful link I've found is for this demo :
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
您当然可以使用 webGL 或 3-d javascript 库使用画布创建 3-d 模型，但如果您想创建 rubix 立方体，我个人会使用 CSS3 转换和翻译（我保证，这将是更少的代码） 。看看这个，你会受到启发：
http://www.paulrhayes.com/2009-07/animated-css3-cube-interface-using-3d-transforms/
该演示使用线性旋转，但如果使用缓入出旋转，旋转会看起来更自然。
You can certainly create 3-d models with canvas using webGL or 3-d javascript libraries, but I would personally use CSS3 transforms and translations instead if you're wanting to create a rubix cube (I promise, it would be MUCH LESS code). Check this out and you'll be inspired:
http://www.paulrhayes.com/2009-07/animated-css3-cube-interface-using-3d-transforms/
This demo is using linear rotations, but if you use ease-in-out rotations, the rotations will look much more natural.
我不久前写过
http://www.pascarello.com/canvas/rubikscube/
当您开始混合颜色时会遇到问题，但您可以使用代码。
I wrote this awhile back
http://www.pascarello.com/canvas/rubikscube/
It has issues when you start to mix up colors, but you can play with the code.