AngularJs nvD3 LineChart расширяет другой список значений вместо yAxis

Question

Я пытаюсь получить разные значения в подсказке LineChart вместо значений в yAsis. Предпосылки для отображения больших чисел> 100.000 в сокращенной версии, такой как «100T» на yAxis. Открывая всплывающую подсказку, рекомендуется видеть правильное значение из этой точки, а не укороченное значение из yAxis.

Скриншот:

Можно ли реализовать это? С уважением Tim

Answer 1

Итак, это мое решение:

chart.interactiveLayer: { 
tooltip: { 
    contentGenerator: function(d) { 
     var html = '<div class="ods-tooltip-content">'; 
     html += '<h4 style="">' + d.value + '</h4>'; 
     d.series.forEach(function(elem){ 
      html += '<div class="ods-tooltip-row">'; 
       html += '<div class="ods-tooltip-colorlabel" style="background-color: ' + elem.color + '"></div>' 
       html += '<div class="ods-tooltip-key">' + elem.key + '</div>'; 
       html += '<div class="ods-tooltip-value">' + DE.numberFormat("01,.2f")(elem.value) + '</div>'; 
      html += '</div>'; 
     }); 
     html += '</div>'; 
     return html; 

     // return d.series[0].key + ' ' + d.series[0].value; 




    } 
} 

}

И это CSS для этих примеров:

#widget .ods-tooltip-content { 
 
\t padding: 0 10px 15px 10px; 
 
} 
 

 
#widget .ods-tooltip-content h4 { 
 
\t text-align: left; 
 
} 
 

 
#widget .ods-tooltip-content .ods-tooltip-row { 
 
\t margin: 0 0 5px 0; 
 
} 
 

 
#widget .ods-tooltip-content .ods-tooltip-row:last-child { 
 
\t margin: 0; 
 
} 
 

 
#widget .ods-tooltip-content .ods-tooltip-row > div { 
 
\t display: inline-block; 
 
\t box-sizing: border-box; 
 
\t vertical-align: middle; 
 
\t line-height: 17px; 
 
} 
 

 
#widget .ods-tooltip-content .ods-tooltip-row .ods-tooltip-colorlabel { 
 
\t border: 1px solid #333; 
 
\t width: 15px; 
 
\t height: 15px; 
 
} 
 

 
#widget .ods-tooltip-content .ods-tooltip-row .ods-tooltip-key, 
 
#widget .ods-tooltip-content .ods-tooltip-row .ods-tooltip-value { 
 
\t margin: 0 0 0 10px; 
 
} 
 

 
#widget .ods-tooltip-content .ods-tooltip-row .ods-tooltip-value { 
 
\t font-weight: bold; 
 
}