pentaho - pentaho ccc ドーナツチャートの中央にテキストを追加する

Question

この質問を Google で検索したところ、ハイチャートまたは D3 グラフに対する回答しか得られませんでした。

このデモはハイチャート用です: http://jsfiddle.net/sJfuA/22/

また、ここで例を見つけました: http://pentaho-bi-suite.blogspot.com/2014/08/dual-level-pie-chart-in-pentaho-cde.html、しかし、目的に合わせてコードを微調整できませんでした。

私のユースケース

拡張ポイントオプションを使用して円グラフを作成します。

slice_innerRadiusEx: 50%

これは、このデモに非常に似ています: http://jsfiddle.net/make_dream/sugmyyto/、次に、数字をパイの中心に配置しようとしています (前のデモの白い領域を参照)。

私が欲しいのは、このチャートとほぼ同じです: http://bl.ocks.org/ckuijjer/6929969ですが、2 番目の jsfiddle デモのコードスニペットを使用して実装します。

score 0 · Accepted Answer

CCC 構成または拡張ポイントを介して実行できるとは思いません。

人々が通常行うことは、中央に定義済みの空のスペースがあるドーナツチャートを作成し、その上に div を追加し、たとえばテキストコンポーネントを使用して、ドーナツの中央に必要なテキストをその div に追加することです。

中央のテキストは実際にはドーナツの一部ではなく、別のコンポーネントによって追加されています。次に、CSS を慎重に作成して、テキストをドーナツの中心に揃え、コンテナからはみ出さないようにする必要があります。