【文本】HTML5 Canvas小项目:环形文字(另祝1024节日快乐)
我的处女作《Canvas系列教程》在我的Github上正在连载更新,希望能得到您的关注和支持,让我有更多的动力进行创作。
教程介绍、教程目录等能在README里查阅。
介绍
之前我们实现了环形,也实现了文字,现在我们把二者结合在一起。正值今天是1024节,于是就简单实现了一个旋转的环形文字小特效。
实现环形文本只需要几步:
- 计算圆弧周围每个字符的绘制坐标。
- 讲坐标系平移到每个字符的绘制坐标。
- 将坐标系旋转π/2-angle度。
- 对字符进行填充或描边操作。