canvas 练手之太极图

html5 是个好东西，引入了很多新的概念和规范，对于前端工程师们是个好消息，但也是个坏消息。说它是好消息是因为 html5 给我们带来了更多的 API，canvas 就是其中之一，同时，说它是坏消息是因为我们没法随心所欲地使用 html5，我们还要兼顾考虑 ie6/ie7 这样的低端浏览器，尤其是在国内这样的 ie6 重灾区，有时候我们不得不用最稳妥最安全最兼容的写法使所有不同浏览器下访问到的效果一致。

这他瞄的就是一个杯具！

html5 有这么多好玩又实用的 API，我们为什么还要踌躇不前？还在等什么呢？前端们是推动浏览器*的引领者，我们必须迈开这一步，先拿 canvas 来耍耍。

虽然在平时的工作，用到 canvas 的机会实在不多，偶尔需要一个炫一点的动画效果，也因为兼容问题被 flash 方案给取代。但这并不影响我喜欢新奇的玩意儿，花了一天时间在家翻了一下 canvas 的 API，就写了一个可以控制旋转速度、尺寸、自动旋转的太极图玩玩，代码其实不难，但是被这 sin cos 三角函数折腾了 80% 的时间，还有什么贝塞尔曲线，真要了我的老命，恨不得把高中数学拿出来再啃一遍。

在 ie6/7/8 下是没法看了，推荐用 webkit 内核的浏览器来试试，比如说 Chrome，相当流畅，在 iphone 也看了一下，也是一样的流畅，要不怎么说 canvas 可以用来做*呢，还是相当给力的。

总结下来，想要写好 canvas，难点和瓶颈不在于编码能力，而在于数学基础，这有点让我抓狂，这样看来以前学的三角函数、微积分啥的又要重新捡起来了，被自己打击到了。

本文转自：Life Studio 非本站原创 如果侵犯了您的权力 请Email：13612963@qq.com 告知

相关文章