como definir o domínio e escala em um eixo em um multiBarChart nvd3.js
Em d3.js você pode definir um eixo x para usard3.time.scale()
então definax.domain([start_date, end_date])
e "preencherá" todas as datas ausentes que não estão nos dados com valores 0. Eu quero fazer o mesmo com um nvd3.jsmulitBarChart
.
Este código (pode ser colado diretamente emhttp://nvd3.org/livecode/#codemirrorNav) mostra um gráfico de barras dos totais por ano, faltam valores para 2002 e 2003. Quero definir a escala a serd3.time.scale()
e, em seguida, o domínio para o primeiro e último anos do conjunto de dados, para que os anos que faltam sejam adicionados automaticamente com os valores 0. Como faço isso?
nv.addGraph(function() {
var chart = nv.models.multiBarChart();
chart.xAxis
.tickFormat(function(d){ return d3.time.format('%y')(new Date(d)); });
chart.yAxis
.tickFormat(d3.format(',f'));
chart.reduceXTicks(false);
chart.showControls(false);
var data = [{
'key': 'GB by year',
'values': [
{x: new Date().setFullYear('2001'), y: 0.12},
{x: new Date().setFullYear('2004'), y: 0.03},
{x: new Date().setFullYear('2005'), y: 0.53},
{x: new Date().setFullYear('2006'), y: 0.43},
{x: new Date().setFullYear('2007'), y: 5.5},
{x: new Date().setFullYear('2008'), y: 9.9},
{x: new Date().setFullYear('2009'), y: 26.85},
{x: new Date().setFullYear('2010'), y: 0.03},
{x: new Date().setFullYear('2011'), y: 0.12}
]
}];
d3.select('#chart svg')
.datum(data)
.transition().duration(500).call(chart);
nv.utils.windowResize(chart.update);
return chart;
});