2015-12-07 2 views
0

У меня есть этот код:Как форматировать число точность до двух цифр после десятичной точки в Plottable.js PieChart этикетки

var store = [{ Name:"Item 1", Total:18.73424242 }, 
 
       { Name:"Item 2", Total:7.34311 }, 
 
       { Name:"Item 3", Total:3.1235535}, 
 
       { Name:"Item 4", Total:12.763574}]; 
 
    
 

 
    var colorScale = new Plottable.Scales.Color(); 
 
    var legend = new Plottable.Components.Legend(colorScale); 
 

 
    var pie = new Plottable.Plots.Pie() 
 
    .attr("fill", function(d){ return d.Name; }, colorScale) 
 
    .addDataset(new Plottable.Dataset(store)) 
 
    .sectorValue(function(d){ return d.Total; }) 
 
    .labelsEnabled(true); 
 
    
 
    
 
    new Plottable.Components.Table([[pie, legend]]).renderTo("#chart");
<link href="https://rawgithub.com/palantir/plottable/develop/plottable.css" rel="stylesheet"/> 
 
<script src="http://d3js.org/d3.v3.min.js"></script> 
 
<script src="http://rawgithub.com/palantir/plottable/develop/plottable.js"></script> 
 
<div id="container"> 
 
    <svg id="chart" width="350" height="350"></svg> 
 
</div>

Как форматировать значения 2 цифры после десятичной точки: 18.73, 7.34, 3.12, etc2 внутри круговая диаграмма?

+0

Откуда берутся итоги? Например, в этом '{Name:" Item 4 ", Total: 12.763574}' где находится '12.763574'? Является жестко закодированным? –

ответ

2

Использование d3.format() или .toFixed().

var pie = new Plottable.Plots.Pie() 
.attr("fill", function(d){return d.Name; }, colorScale) 
.addDataset(new Plottable.Dataset(store)) 
.sectorValue(function(d){ return +d3.format('0.2f')(d.Total);}) 
    //.sectorValue(function(d){ return +d.Total.toFixed(2);}) //works too 
.labelsEnabled(true); 

Адрес gist.

+0

Что случилось с 'toFixed (2)'? – mkoryak

+0

ничего вообще :) '.sectorValue (функция (d) {return + d.Total.toFixed (2);})' тоже должна работать. – jwildfire

+0

По какой-то причине 'toFixed (2)' не работал для меня. – neversaint

Смежные вопросы