circleChartは多彩なカスタマイズを実現した円形チャートを実装することができるjQueryプラグインです。使い方が簡単ながら、オプションが豊富に用意されているので自分好みにカスタマイズして使用できます。
circleChart
circleChartの実際のデモページは以下になります。
デモページには、color、backgroundColor、background、speed、widthRatio、value、size、startAngle、animateなど、たくさんのサンプルが用意されています。
各サンプルにある「Neu darstellen」というボタンをクリックすると、チャートのメーターが動き出します。比率や数値など、視覚的にどのくらい多いのか少ないのかが瞬時にわかるので、ユーザーにとっては便利ですね。
円形チャートのカラーや背景カラー、スピード、幅、サイズなど、細かいところまでしっかりカスタマイズできます。さらに、メーターが動きだすスタート地点(角度)やアニメーションのセッティングも可能です。
アニメーションの種類はかなり豊富で、linearTween、easeInQuad、easeOutQuad、easeInOutQuad、easeInCubic、easeOutCubic、easeInOutCubicなど、他にもいろんな種類が用意されています。
ちなみに、デモページでは、linearTween、easeInOutQuart、easeInOutSineの3つのアニメーションを確認できますよ。
これらの他にも、まだまだ多彩なオプションが用意されているので、気になる人はぜひチェックしてみてください。
というわけで、豊富なオプションによるカスタマイズ性に優れた円形チャートを実装できるjQueryプラグイン「circleChart」のご紹介でした。
circleChartの詳しい使い方やダウンロードは、以下のページからどうぞ。