javascript - 2 色の範囲で円グラフにグラデーション カラーを使用する

Question

2 つの色を指定して、次のような円グラフを作成したいと思います。

例を作成するためにチャート ウィザードを使用しましたが、非推奨のようであり、作成するアプリケーションでは円グラフを使用します。円グラフでその効果を得る方法はありますか?

Answer 1

新しいSVG円グラフの標準構成オプションでは不可能です。

ただし、そのようなことに興味がある場合は、CSSを使用して円グラフの要素に色を付けることができます。CSSは、ブラウザなどに応じてさまざまな方法でグラデーションを作成できます。詳細については、このサイトを参照してください。

円グラフの特定の要素に色を付けたい場合は、Google Chromeの開発者ツールなどを使用して特定の要素を追跡し、上記のようにCSSを使用してその要素の色を変更できます。

これはIEでは正しく機能しない可能性があります（ほとんど機能しません）。

ただし、一般的に、グラデーションの使用は見た目がよく、実際にはグラフが読みにくくなります（円グラフの場合はそれほど重要ではありません。円グラフは、最初からグラフを選択するのに最適ではありません）。