2014-01-12 2 views
0

내 차트가 y 축의 값을 반복합니다. 난 단지 사이 1,2,3하지만 아무것도 할 수있는 방법이 있나요 (예를 들어, 내가 y 축에 아래 표에 표시됩니다 한 문제) :nvd3 y 축에서 반복되는 값 방지

enter image description here

사용하여 코드 메신저 같은 것입니다 이 :

nv.addGraph(function() { 
    var chart = nv.models.multiBarChart(); 

    chart.xAxis 
     .tickFormat(function(d) { return d3.time.format('%x')(new Date(d)) }); 

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

    d3.select('#errorsFiredByDate') 
     .datum([{values: output, key: "Count by date"}]) 
     .transition() 
     .duration(500) 
     .call(chart); 

     nv.utils.windowResize(chart.update); 

    return chart; 
}); 
+0

하지 않음 해결하기 위해 차트 옵션에서 이런 짓을 - 소수점 하나 개의 값이 있어야한다는 전화 번호 형식을 지정합니다 (' ' , .1f). 해당 형식 지정자를 변경해보고 시도 했습니까? –

+0

나는 위의 스크린 샷으로'0f'를 사용하도록 설정했습니다. 코드 샘플에있는'.1f'로 먼저 시도했지만 소수점을 넣었지만 0.5는 사용하지 않는 것이 좋습니다. 나는'0f'를 사용하여 문제를 해결할 수있을 것이라고 생각했지만 아직도'1'을 두 개 가지고 있습니다. – Akshat

+0

아 좋아, 실제 틱 수를 제어하고 싶습니까? –

답변

2

D3 축에서 눈금을 제어 할 수있는 몇 가지 옵션이 있습니다. .ticks()을 사용하여 명시 적으로 틱 수를 지정할 수 있지만 이는 레이아웃에 대한 더 많은 힌트입니다. 진드기에 대해 확실하게 알고 싶다면 .tickValues()을 사용하여 진드기 값을 명시 적으로 설정하십시오.

이 경우 다음과 같이 표시됩니다.

chart.yAxis.tickValues(d3.range(chart.yAxis.scale().domain()[0], chart.yAxis.scale().domain()[1]); 

구체적인 용도에 따라 다른 방법을 사용할 수도 있습니다.

1

답장이 늦었지만 다른 사람들에게 유용 할 수 있습니다. 이미 적용된 진드기의 배열을 유지하여 중복 진드기를 제거하는 해결 방법을 사용합니다 & d3의 다중 형식 지정자.

uniqueTicks = []; 
xTickFormat = d3.time.format.multi([ 
            ["%Y", function (d) { 
             if (uniqueTicks.indexOf(d.getFullYear()) === -1) { 
              uniqueTicks.push(d.getFullYear()); 
              return true; 
             } else { 
              return false; 
             }           
            }], 
            ["", function() { 
             return true; 
            }] 
           ]); 

d3.svg.axis().tickFormat(xTickFormat); 

이 트릭은 다른 유형의 틱 형식에 맞게 조정할 수 있습니다.

1

저도 같은 문제에 직면하고 있었고, 난 거기에 무슨 일이 일어나고 있는지 확인

yAxis: { 
     tickFormat: function(d){ 
     if ((d * 10) % 10 === 0) { 
      return d3.format('.0f')(d); 
     } 
     else { 
      return ''; 
     } 
     } 
    } 
관련 문제