16

次のコードを使用して、パーセントを表示するようにツールチップを設定できます。

var formatter = 新しい google.visualization.NumberFormat({
      分数桁数: 2,
      サフィックス: '%'
    });
formatter.format(データ、1); // 最初の列にフォーマッタを適用します。

NumberFormat で各要素を 100 倍にする方法はありますか? それ以外の場合、ツールチップは .50% として表示されます。

私はvAxis.format = "format:'#%' "100 倍するものを使用しています。したがって、.5 は縦軸で 50% として表示されます。

ドキュメント ( icu-project.org/apiref ) によると、これは % を一重引用符で囲むことで上書きできますが、これは機能しませんでした。

最終的な結果は、ツールチップが軸と一致しないことです。これを行う最善の方法は何ですか？

4

4 に答える 4

22

あなたがするのとまったく同じようにフォーマッターを指定することで、これを機能させました：

var chartData = google.visualization.arrayToDataTable(tableData);
var formatter = new google.visualization.NumberFormat({
    fractionDigits: 2,
    suffix: '%'
});
formatter.format(chartData, 1);

最後の呼び出しの1は、float 値を持つ 2 番目の列を意味します。

次に、グラフ オプションで軸の形式を指定し、ドキュメントなどで指摘されているようにパーセント記号をエスケープします。

var chartOptions = {
    vAxis: { format: '#\'%\'' }
};

次に、チャートを描きます。

var chart = new google.visualization.ColumnChart(document.getElementById('chart'));
chart.draw(chartData, chartOptions);

10%これは、などの値で左側の軸をレンダリングします20%。また、ツールチップはデフォルトのもののように見えますが、パーセンテージは など10.10%です20.20%。

左側の軸にも小数点以下 2 桁が必要な場合は、代わりにこれをチャート オプションの形式として使用します。

vAxis: { format: '#.00\'%\'' }
于 2013-07-06T16:52:29.730 に答える
7 
var formatter = new google.visualization.NumberFormat({ 
  pattern: '#%', 
  fractionDigits: 2
});

http://groups.google.com/group/google-visualization-api/に感謝します

于 2011-12-09T17:53:03.713 に答える
3

パーセント (%) 記号自体を一重引用符で囲む必要があります。

私がこれを行っていた行は次のようになります。options['vAxis'] = {'format': "#,###'%'"};

これを上記のフォーマッタと組み合わせて、縦軸にパーセント記号を持たせ、ツールチップにもそれを含めることができます。

于 2011-08-30T19:21:56.547 に答える