Comment dessiner des diagrammes à barres avec la gamme x-axe?

Question

J'utilise angular-nvd3 pour tracer des graphiques.

Existe-t-il une option de diagramme à barres avec un axe x comme celui-ci?

*** 
    ***    *** 
    ***  ***  *** 
    ***  ***  ***  *** 
    ***  ***  ***  *** 
| *** | *** | *** | *** | 
0am  1am  2am  3am  4am 

Je ne veux pas tirer de cette façon:

*** 
    ***   *** 
    *** *** *** 
    *** *** *** *** 
    *** *** *** *** 
    *** *** *** *** 
    0am 1am 2am 3am 

PS: angular-nvd3 est une enveloppe pour nvd3, qui est un des graphiques réutilisables pour d3.js.

Answer 1

Je ne peux pas penser à une manière propre de faire ceci. Je ne sais pas pourquoi vous voulez le faire TBH - ça a l'air un peu bizarre. Mais de toute façon - voici une solution hacky pour NVD3 que vous pouvez porter sur AngularNVD3.

chart.rectClass('shift-right') 

puis une fois que vous avez fait

d3.select('#chart svg') 
    .datum(exampleData()) 
    .transition().duration(350) 
    .call(chart); 

Put

d3.selectAll('.shift-right').attr('x', '30'); 

Cela déplace toutes les barres au-dessus de par 30px.

http://jsfiddle.net/h7Lmkb4f/1/