NVD3 D3在xaxis上获取特定标签

时间:2013-04-25 07:59:50

标签: javascript d3.js nvd3.js

我正在使用nvd3库来生成分组多条形图。这是我的数据集(采用JSON格式)

[{"key":"Param 1","values":[{"y":2.0,"x":"2010-04-01"},{"y":0,"x":"2010-10-01"},{"y":0,"x":"2010-12-01"},{"y":0,"x":"2011-01-01"},{"y":0,"x":"2011-04-01"},{"y":0,"x":"2011-10-01"},{"y":0,"x":"2012-01-01"},{"y":0,"x":"2012-03-01"},{"y":0,"x":"2012-05-01"},{"y":0,"x":"2012-08-01"},{"y":0,"x":"2012-10-01"},{"y":0,"x":"2012-11-01"},{"y":25.0,"x":"2012-12-01"},{"y":0,"x":"2013-01-01"},{"y":0,"x":"2013-02-01"},{"y":0,"x":"2013-03-01"},{"y":0,"x":"2013-04-01"}]},{"key":"Param 2","values":[{"y":160.0,"x":"2010-04-01"},{"y":0,"x":"2010-10-01"},{"y":0.0,"x":"2010-12-01"},{"y":0,"x":"2011-01-01"},{"y":4.0,"x":"2011-04-01"},{"y":0,"x":"2011-10-01"},{"y":0.0,"x":"2012-01-01"},{"y":45.0,"x":"2012-03-01"},{"y":9.0,"x":"2012-05-01"},{"y":0,"x":"2012-08-01"},{"y":10.0,"x":"2012-10-01"},{"y":0,"x":"2012-11-01"},{"y":30.0,"x":"2012-12-01"},{"y":0.0,"x":"2013-01-01"},{"y":58.0,"x":"2013-02-01"},{"y":52.0,"x":"2013-03-01"},{"y":36.0,"x":"2013-04-01"}]},{"key":"Param 3","values":[{"y":80.0,"x":"2010-04-01"},{"y":12.0,"x":"2010-10-01"},{"y":0.0,"x":"2010-12-01"},{"y":0,"x":"2011-01-01"},{"y":2.0,"x":"2011-04-01"},{"y":0.0,"x":"2011-10-01"},{"y":0.0,"x":"2012-01-01"},{"y":33.0,"x":"2012-03-01"},{"y":16.0,"x":"2012-05-01"},{"y":20.0,"x":"2012-08-01"},{"y":0.0,"x":"2012-10-01"},{"y":150.0,"x":"2012-11-01"},{"y":65.0,"x":"2012-12-01"},{"y":0.0,"x":"2013-01-01"},{"y":44.0,"x":"2013-02-01"},{"y":116.0,"x":"2013-03-01"},{"y":24.0,"x":"2013-04-01"}]},{"key":"Param 4","values":[{"y":0,"x":"2010-04-01"},{"y":8.0,"x":"2010-10-01"},{"y":0,"x":"2010-12-01"},{"y":0,"x":"2011-01-01"},{"y":0,"x":"2011-04-01"},{"y":0.0,"x":"2011-10-01"},{"y":4.0,"x":"2012-01-01"},{"y":0,"x":"2012-03-01"},{"y":0,"x":"2012-05-01"},{"y":0,"x":"2012-08-01"},{"y":0,"x":"2012-10-01"},{"y":0,"x":"2012-11-01"},{"y":0.0,"x":"2012-12-01"},{"y":0,"x":"2013-01-01"},{"y":0,"x":"2013-02-01"},{"y":67.0,"x":"2013-03-01"},{"y":0,"x":"2013-04-01"}]},{"key":"Param 5","values":[{"y":0,"x":"2010-04-01"},{"y":0,"x":"2010-10-01"},{"y":0,"x":"2010-12-01"},{"y":15.0,"x":"2011-01-01"},{"y":0,"x":"2011-04-01"},{"y":0,"x":"2011-10-01"},{"y":0,"x":"2012-01-01"},{"y":0,"x":"2012-03-01"},{"y":0,"x":"2012-05-01"},{"y":0,"x":"2012-08-01"},{"y":0,"x":"2012-10-01"},{"y":0,"x":"2012-11-01"},{"y":0,"x":"2012-12-01"},{"y":0,"x":"2013-01-01"},{"y":250.0,"x":"2013-02-01"},{"y":120.0,"x":"2013-03-01"},{"y":100.0,"x":"2013-04-01"}]}]

这是我正在使用的代码:

var chart;
nv.addGraph(function() {
chart = nv.models.multiBarChart()
  .barColor(d3.scale.category20().range());

chart.xAxis
    .showMaxMin(true).tickFormat(function(d){return d3.time.format('%b-%y')(new Date(d));});

chart.yAxis
    .tickFormat(d3.format(',1f'));

d3.select('#plot_container svg')
    .datum(plot_data)
  .transition().duration(500).call(chart);

nv.utils.windowResize(chart.update);

chart.dispatch.on('stateChange', function(e) { nv.log('New State:', JSON.stringify(e)); });

return chart;

我在x轴上获得的标签由图书馆本身创建。我希望x轴上的所有月份都可以获得数据。此外,所有这些月份应该是等间隔的,而不是线性的。

我尝试过像tickValues这样的东西无济于事。 该怎么做?

0 个答案:

没有答案