d3.js에서 10^c 대신 2^(10 * c) 간격으로 틱이있는 선형 눈금/축?

Question

d3.js를 사용하여 네트워크 트래픽에 대한 정보를 효과적으로 보여줍니다. 시각화의 특정 시점에서 Y 축은 바이트 수를 표시하는 데 사용됩니다.

현재 d3.svg.axis(). ticks() 시스템을 사용 중이므로 20000과 같은 좋은 숫자가됩니다. 그러나 kB/MB/etc로 변환하면 결과는 19.5와 같이 어색한 숫자가됩니다. 9.8. (10^c)의 배수 대신 1024, 1048576 등과 같이 (2^(10 * c))의 배수로 틱을 다시 얻는 방법이 있습니까?

기타 정보/생각 :

• 그 svg.axis 나를 위해 너트와 그림의 볼트를 처리 주셔서 감사 드리며,이 기능을 대체하지 않는 해결책을 찾기 위해 싶습니다.
• 나는 @mbostock 및 회사와 함께하는 한 d3을 수정하고 풀 요청을 제출할 수 있습니다.
• 나는 코드 in and around d3_scale_linearTickRange()에 초점을 맞춘 리포즈를 확인했지만 다른 축에 필요한 기본 기능을 변경하지 않고 내 목표를 달성하는 간단한 방법을 보지 못했습니다.
• 가능성이있는 해결 방법은 posted below으로 간주 될 수 있지만 부정 직감으로 이어집니다.

Answer 1

당신은 수동으로 틱 값을 처리 할 수있는 : https://github.com/mbostock/d3/wiki/SVG-Axes#wiki-tickValues

var xAxis = d3.svg.axis() 
    .scale(x) 
    .tickValues([1, 2, 3, 5, 8, 13, 21]); 

그리고 당신은 수정 정밀도와 SI 접두어에 대한 서식 도움, 즉 대한 tickFormat를 사용할 수 있습니다. https://github.com/mbostock/d3/wiki/Formatting#wiki-d3_format

Answer 2

최종 결과를 얻으려면 잘못된 방법으로 레이블을 kilo- 및 mega -를 사용하여 1024 대신 1000으로 나누어야합니다.

Instead of: 
20000 B/1024 = 19.5 kB  :(

Stretch the truth with: 
20000 B/1000 = 20 kB  :) 

이것은 의도적으로 오류를 소개한다는 점에서, 얼굴에 받아 들일 수없는 것,하지만 난 그것을 떨어져 "몇 픽셀"있다고 자신을 설득 할 수 있다면, 나는 수술을 수행하지의 이익에 갈 수있다 d3 자체.

나는 더 나은 방법이있을 것이라고 확신합니다. 여기에 설명 된대로