2

積み上げ棒グラフを使用しています。ツールチップに正確な値ではなく、データのカテゴリのみを表示するにはどうすればよいですか、または代わりに、バーの最後に値ではなくカテゴリを表示することができます (設定し.showValue(true)た場合のように、カテゴリを使用します)。

アップデート

ツールチップにカテゴリ (キー) のみを表示する解決策を見つけましたが、ソース コードの変更が必要で、見栄えがよくありません。私がやりたいことの適切な名前は、各バーのラベルを表示することだと思います。このコードでは動作させることができません:

chart.xAxis.
          .axisLabel(attrs.xAxisLabel)
          .tickFormat(d3.format('r'));

attrsが定義されていないというエラーが表示されるためです。私はここからアイデアを得ました。しかし、私はそれを機能させることはできません。

アップデート

もう少し具体的に言うと:

マイチャート

round_1_2ホバーしたときだけでなく、縦軸に を表示したい。

4

1 に答える 1

3

更新:作業フィドル: http://jsfiddle.net/reblace/D2Dak/4/

エラーを生成する NVD3 コードにはまだいくつかの問題があります...サイトの例にも問題があります...しかし、ここで言及したことは実証可能です。

コードを変更せずにツールチップをカスタマイズするには、コードでこれを試してください。

chart.tooltip(function(key, x, y, e, graph) {
    return '<h3>' + key + '</h3>' +
           '<p>' +  y + ' on ' + x + '</p>';
});

multibarchart 関数の関数を介してツールヒントを公開するため、ツールヒントのレンダリングに使用される HTML テンプレートを変更できます。

もあります

chart.reduceXTicks(false);      // Will show labels on all bars
chart.rotateLabels(angle);      // Rotate the labels to "angle" degrees
chart.xAxis.staggerLabels(true) // Staggers the X Axis labels vertically so they don't run into eachother

ソースコードを見ると、すべてを変更できるセクションが見つかります。

//============================================================
// Expose Public Variables
//------------------------------------------------------------

// expose chart's sub-components
chart.dispatch = dispatch;
chart.multibar = multibar;
chart.legend = legend;
chart.xAxis = xAxis;
chart.yAxis = yAxis;
...
chart.reduceXTicks= function(_) {
  if (!arguments.length) return reduceXTicks;
  reduceXTicks = _;
  return chart;
};

chart.rotateLabels = function(_) {
  if (!arguments.length) return rotateLabels;
  rotateLabels = _;
  return chart;
}

chart.tooltip = function(_) {
  if (!arguments.length) return tooltip;
  tooltip = _;
  return chart;
};

Mike Bostock は、「再利用可能なチャートに向けて」で NVD3 が従うデザイン パターンについて説明しています。http://bost.ocks.org/mike/chart/

于 2013-09-27T19:41:38.927 に答える