什么是好的CSS/HTML/SVG/Javascript来为分数0到10制作循环图像？（需要在IE 7和其他常用浏览器上工作）

要制作这样的图像：

它必须支持从0.0到10.0的分数，并相应地绘制纯色-对于1.0，它是36度，对于9.0，它是360 x 0.9=324度

仅仅使用HTML/CSS/SVG/Javascript有没有一个好方法？要求是它需要在IE7及以上、FF、Chrome和Safari上工作。更新：或者，在IE8及以上版本中使用，而在IE7中，只需返回到纯色循环即可

我曾考虑使用一个solid loop 1图像，再加上20个alpha透明图像来覆盖solid loop，这样就可以覆盖粒度为0.5（如4.0、4.5、5.0）的图像，但缺点是总共有21个图像可以放入sprite，但仍然相当大。

和

您熟悉JS库吗？看看他们的例子，他们给人留下了深刻的印象。

这一段：

我在考虑使用实心环 1张图像，加上20张alpha图像 遮盖固体的透明胶片 循环，使粒度为0.5 例如4.0、4.5、5.0都是 有保险，但缺点是 总共可以放21张图片 变成一个精灵，但还是很大

听起来需要做很多工作：

相反，我可能会尝试使用它

Raphaël目前支持Firefox 3.0+、Safari 3.0+、Chrome 5.0+、Opera 9.5+和Internet Explorer 6.0+

这是一个看起来与您的图像模糊不清的演示，它具有动画同心圆：

---

IE7不能很好地处理alpha透明胶片，您最好使用淡橙色的纯色，而不是alpha。如果您需要IE7支持，SVG是完全不可能的。@谢谢。如果只适用于IE8及以上版本，而适用于IE7的则返回到纯色循环呢？使用哪种颜色，而不适用于IE7，而只适用于IE8及以上版本？SVG适用于gecko、webkit、opera；IEs 5+的VML是的，确实令人印象深刻。我也试过Protovis。。。但由于某些原因，它的极时钟在使用VirtualBox的虚拟PC上运行于IE7兼容模式的IE8上不起作用。。。但拉斐尔的极地时钟运转良好