pie-chart - 如何在nvd3饼图中制作工具提示标签整数

Question

这是我的代码:

 function graphDataAllChart(graphData) {
        $(".dataContentAllPie").empty();
nv.addGraph(function() {

  var chart = nv.models.pieChart()
                  .x(function(d) { return d.label })
                  .y(function(d) { return d.value })
                  .showLabels(true)     //Display pie labels
                  .labelThreshold(.05)  //Configure the minimum slice size for labels to show up
                  .labelType("percent") //Configure what type of data to show in the label. Can be "key", "value" or "percent"
                  .donut(true)          //Turn on Donut mode. Makes pie chart look tasty!
                  .donutRatio(0.35)     //Configure how big you want the donut hole size to be.
                ;

    d3.select("#chart2 svg")
        .datum(graphData)
        .transition().duration(350)
        .call(chart);

    return chart;
});

};

在这里，当显示饼图时，它以十进制格式显示数字，即显示一个值，如 1564.00我想要的是去掉小数点，让它看起来像 1564

我尝试将标签修改为

.y(function(d) { return Math.round(d.value) })

但未能达到预期的效果。

谁能帮我解决这个问题？

Answer 1

您可以使用 nvd3 库的 valueFormatter 属性。它在 1.8 或更高版本中可用。

 function graphDataAllChart(graphData) {
        $(".dataContentAllPie").empty();
nv.addGraph(function() {

  var chart = nv.models.pieChart()
                  .x(function(d) { return d.label })
                  .y(function(d) { return d.value })
                  .showLabels(true)     //Display pie labels
                  .labelThreshold(.05)  //Configure the minimum slice size for labels to show up
                  .labelType("percent") //Configure what type of data to show in the label. Can be "key", "value" or "percent"
                  .donut(true)          //Turn on Donut mode. Makes pie chart look tasty!
                  .donutRatio(0.35)     //Configure how big you want the donut hole size to be.
                  .tooltip.valueFormatter(d3.format('d')) // This will round the value without decimal. 
                ;

    d3.select("#chart2 svg")
        .datum(graphData)
        .transition().duration(350)
        .call(chart);

    return chart;
});

};

这对我有用。也只是通过这个问题nvd3 tooltip decimal format