用Javascript围绕圆圈的文字

Question

我在Stackoverflow上搜索了同样的问题，但所有看起来有点像我的问题的问题都在Xcode（iPhone）中编程。我正在使用Javascript，但我无法弄明白我是如何解决这个问题的。

我创造了一个明星（基于RaphaelJS）。那颗恒星有一个可变的星点，所以它可能是一个有8点的星，但也有9或10或11 ..我的问题是，我希望围绕那颗恒星的圆圈内的文字。如果这个星有8个点，那么每个点都有它自己的单词（所以8个单词）。

我在Illustrator中说明了我的问题，所以也许我的问题澄清了：

此刻我正在用图像做这件事，但这不灵活（将来我会通过使用数据库生成星和单词）。我搜索了很多。我发现任何可行的技术都是SVG。但经过几个小时的反复试验，我没有像我的形象那样的东西。

Answer 1

您可以在SVG中轻松创建此形状。使用polygon创建星标，text和textPath创建星星周围的文字。

有关SVG示例，请参阅this website。特别是你想看看：

• a star using polygon，
• text on a path。

我还建议您查看SVG specification的相关部分。

Answer 2

不可否认，我忘记了图像中的点数，因为这是我添加的最后一件事（d'oh），但是this是我用纯css敲的，基本上你的想法就是你有所有文本绝对位于div的中心开始，然后单独从那里移出它们。我认为用一些js和狡猾的数学来扩展这个想法会非常简单。