2013-12-10 2 views
5

i m с использованием дискретной гистограммы (NVD3 Library) для отображения диаграммы на моем сайте. показывая график, все в порядке, но моя проблема в том, как изменить десятичные значения на целые числа. значения, отображаемые по оси Y, показывающие целочисленные значения. , хотя какой массив я использовал для отображения значений с целыми значениями. JS код, который я использовал нижеКак изменить десятичные значения в целых числах в дискретной гистограмме

 nv.addGraph(function() { 
    var chart = nv.models.discreteBarChart() 
    .x(function(d) { return d.label }) 
    .y(function(d) { return d.value }) 
    .staggerLabels(true) 
    .tooltips(false) 
    .showValues(true) 
    .transitionDuration(250); 
    chart.xAxis.axisLabel("<?php echo $configureGrid['x_axis']['legend']; ?>"); 
    chart.yAxis.axisLabel("<?php echo $configureGrid['y_axis']['legend']; ?>"); 
    d3.select('#issue_by_time svg') 
    .datum(historicalBarChart) 
    .call(chart); 
    nv.utils.windowResize(chart.update); 
    return chart; 
    }); 
    }); 

ответ

12

использование этого

chart.yAxis.tickFormat(d3.format(',f')); 

преобразовать десятичные значения в целое число для оси у

chart.xAxis.tickFormat(d3.format(',f')); 

преобразовать десятичные значения в целое число для оси х

chart.valueFormat(d3.format('d')); 

, чтобы преобразовать значение десятичного знака в целочисленный, принимающий ввод по графику

+0

Вы пробовали это? Это не сработало для меня. –

+1

Я пробовал это, и это работает на меня. –

+0

+1 отлично подходит для меня тоже ... – suhailvs

0

Вы не можете сделать это прямо в NVD3, но выбрав text элементы вручную и изменения текста, вы можете. Следующий код, запускаемый после создания диаграммы, позаботится об этом.

d3.selectAll(".nv-y.nv-axis") 
    .selectAll("text[text-anchor=end]") 
    .text(function() { return Math.round(d3.select(this).text()); }); 
+0

мы можем сделать это непосредственно @Lars kotthoff.see мой ответ. –

4

chart.valueFormat (d3.format ('d')); это показывает точные значения, как в таблице данных (это может быть целое или плавать)

показать точный Вейл на опции showValue вы можете использовать .valueFormat (d3.format()»0' .);

2

Далее, чтобы ответить на @ МоАЗ-Атик, в angular-nvd3 это будет выглядеть

yAxis: { 
    tickFormat: function(d){ return d3.format(',f')(d) } 
} 
Смежные вопросы