CSS3饼图样式进度条?
是否有任何库或示例如何使用 CSS3 创建饼图样式进度条?
Are there any libraries or examples how to create pie style progress bars with CSS3?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
是否有任何库或示例如何使用 CSS3 创建饼图样式进度条?
Are there any libraries or examples how to create pie style progress bars with CSS3?
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
接受
或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
发布评论
评论(3)
Canvas 或 SVG 比 CSS 更适合于此。 (由于缺少圆段)。如果您选择 SVG,Raphaël 可能是一个不错的选择。这是一个(非动画)饼图,它将向您展示如何绘制分段。
Canvas or SVG would be a better fit than CSS for this. (Due to lack of circle segments). Raphaël might be a good choice if you go for SVG. Here's a (non-animated) pie chart, which will show you how to draw segments.
基于 SVG 的图表的另一个不错的选择是 d3.js。它是 Protovis 库的继承者,但更加灵活且编写得更好(因此执行效果更好)。此外,您还可以使用 CSS3 设置 SVG 元素的某些属性的样式,但不如设置 HTML 的样式那么多。然而,CSS 仍然很有用,例如,您仍然可以在某些属性上使用过渡。看一下 W3C 的 Styling SVG 文档(尽管请注意,它只是讨论CSS2)。
another great choice for SVG based graphs is d3.js. It is the successor to the Protovis library, but is much more flexible and much better written (and thus better preforming). Also, you can style some properties of SVG elements with CSS3, but not as much as you can style HTML. However, CSS is still useful, and you can still, for example, use transitions on some properties. Take a look at the W3C's Styling SVG document (although be aware that it just discusses CSS2).
饼图是可能的< /a> 在纯 css 中,但对其进行动画处理可能并不容易。
Pie chart is possible in pure css but animating it may not be easy.