绘制许多六边形并扭曲它们答案

【问题标题】：Drawing lots of hexagons and distorting them绘制许多六边形并扭曲它们
【发布时间】：2012-08-11 16:47:49
【问题描述】：

我正在开始一个网页游戏，我想知道最好的方法。

游戏是从上面看到的六边形区域，可以旋转/倾斜。

最好的方法是什么？我要做的是使用画布并使用 2d 变换来模拟 3d 旋转，问题是：

【问题讨论】：

是的，这有问题。看看WebGL
我同意@Truth。 Webgl 应该可以解决您的问题。试试看three.js，因为我听说用webgl编程会容易很多：github.com/mrdoob/three.js
如果它必须在智能手机上运行，WebGL 真的是一种选择吗？ link
大多数智能手机并不真正支持@Truth Webgl

【解决方案1】：

我能想到两种方法：

仅使用画布。这意味着相当广泛的浏览器支持，很少有怪癖并且通常“正常工作”。潜在问题：像你提到的低端机器上的性能。但是轮换游戏对游戏玩法至关重要吗？如果没有，您可以考虑在速度较慢的智能手机上将其关闭。如果它对游戏玩法不重要，用户很可能不会错过该功能。
画布和 CSS3 转换的组合 (rotating cube example)。可以为您提供比纯画布解决方案更好的性能。潜在问题：需要“混合”技术，这总是意味着遇到意外问题或怪癖的风险。

【讨论】：

【解决方案2】：

你应该看看 www.kineticjs.com

Canvas 是绘制 100 种形状的最佳方式，因为它不会像 SVG 那样为每条路径写入 DOM。

它有几个示例，其中以编程方式绘制了 1000 多个形状。我最近在这里将它用于类似的动画：

【讨论】：