Come visualizzare i valori sopra al grafico multi par 3?

Question

Voglio il valore effettivo di ogni barra visualizzata in alto nel modo in cui è mostrato here

sto cercando questo su multi bar chart.

Impossibile trovare riferimento ovunque.

Answer 1

Non sono sicuro di aver provato così grasso, ma l'esempio in here è piuttosto semplice.

.showValues(true) praticamente il trucco.

Spero che aiuti.

Answer 2

Apparentemente questo non esiste ancora. C'è un problema (https://github.com/novus/nvd3/issues/150) che è stato chiuso perché questo è (apparentemente) difficile da implementare.

Answer 3

duplicati di How to display values in Stacked Multi-bar chart - nvd3 Graphs

C'è una correzione è possibile implementare voi stessi a https://gist.github.com/topicus/217444acb4204f364e46

EDIT: Copiato il codice se il collegamento viene rimosso github:

// You need to apply this once all the animations are already finished. Otherwise labels will be placed wrongly. 

d3.selectAll('.nv-multibar .nv-group').each(function(group){ 
    var g = d3.select(this); 

    // Remove previous labels if there is any 
    g.selectAll('text').remove(); 
    g.selectAll('.nv-bar').each(function(bar){ 
    var b = d3.select(this); 
    var barWidth = b.attr('width'); 
    var barHeight = b.attr('height'); 

    g.append('text') 
     // Transforms shift the origin point then the x and y of the bar 
     // is altered by this transform. In order to align the labels 
     // we need to apply this transform to those. 
     .attr('transform', b.attr('transform')) 
     .text(function(){ 
     // Two decimals format 
     return parseFloat(bar.y).toFixed(2); 
     }) 
     .attr('y', function(){ 
     // Center label vertically 
     var height = this.getBBox().height; 
     return parseFloat(b.attr('y')) - 10; // 10 is the label's magin from the bar 
     }) 
     .attr('x', function(){ 
     // Center label horizontally 
     var width = this.getBBox().width; 
     return parseFloat(b.attr('x')) + (parseFloat(barWidth)/2) - (width/2); 
     }) 
     .attr('class', 'bar-values'); 
    }); 
});