Индикатор прогресса в стиле пирога с CSS3?

Question

Существуют ли какие-либо библиотеки или примеры, как создавать индикаторы выполнения в стиле круговых стилей с помощью CSS3?

Answer 1

еще один отличный выбор для графиков на основе SVG - d3.js . Он является преемником библиотеки Protovis, но гораздо более гибок и намного лучше написан (и, следовательно, лучше преформируется). Кроме того, вы можете стилизовать некоторые свойства элементов SVG с помощью CSS3, но не так сильно, как стиль HTML. Тем не менее, CSS все еще полезен, и вы все еще можете, например, использовать переходы для некоторых свойств. Взгляните на документ W3C Styling SVG (хотя имейте в виду, что он только обсуждает CSS2).

Answer 2

Круговая диаграмма возможна в чистом CSS, но анимация может быть непростой.

Answer 3

Canvas или SVG подойдут лучше, чем CSS. (Из-за отсутствия круговых сегментов). Raphaël может быть хорошим выбором, если вы выберете SVG. Вот круговая диаграмма (не анимированная) , которая покажет вам, как рисовать сегменты.