Skip to content

Formatting

zziuni edited this page Mar 22, 2013 · 22 revisions

WikiAPI ReferenceCoreFormatting

좌표축 라벨에 지저분하게 "0.30000000000000004"라고 표시될 일을 보통 고려하지 않는 이유중 하나는 바로 숫자 포맷팅이 있기 때문이다. "$1,240.10" 처럼 가독성을 위해서 천단위로 끊고 자리수를 고정하거나 아니면 특정 숫자의 유효 자리수만 출력하길 원할 수도 있다. D3는 이런 표준 숫자 포맷팅 사용을 쉽게 해준다. 예를 들어, 네자리로 0을 채우는 함수를 만들려면 다음처럼 한다.

var zero = d3.format("04d");

이제 쉽게 포맷팅할 수 있다.

zero(2); // "0002"
zero(123); // "0123"

숫자 말고도 D3는 날짜콤마로 구분한 값(CSV)의 파싱, 포맷팅도 지원한다.

Numbers

# d3.format(specifier)

specifier 를 포맷을 정의하기위한 문자열로 사용하는 신규 포맷 함수를 반환한다. 포맷 함수는 인자로 숫자를 받고 포맷팅된 숫자형 문자열을 반환한다. 포맷을 위한 문자열은 Python 3.1에 내장된 format specification mini-language를 본떠서 만들었다. 정의 문자열은 [sign][0][width][,][.precision][type] 형태를 띈다.

sign 은 다음중 하나다.

  • plus ("+") - 음수와 양수에서 +, - 기호를 모두 표기한다.
  • minus ("-") - 음수에 대해서만 - 기호를 표기한다. (기본값)
  • space (" ") - 양수는 빈 공백이 표기되고 음수는 - 기호를 표기한다.

comma (",")는 천단위 구분을 위한 콤마 사용용 옵션이다.

width 는 최소 자리수를 정의한다. 정의하지 않으면 입력값으로 정의된다. width 가 0으로 시작하면 모자란 자리수를 0으로 채울 수 있다.

가능한 type 값이다.

  • exponent ("e") - Number.toExponential를 사용한다. (지수)
  • general ("g") - Number.toPrecision를 사용한다.
  • fixed ("f") - Number.toFixed를 사용한다. (반올림)
  • integer ("d") - Number.toString를 사용한다. 정수가 아닌 값은 무시한다.
  • rounded ("r") - fixed와 비슷하지만 precision 로 정의한 자리수에서 반올림한다.
  • percentage ("%") - fixed와 비슷하지만 "%"접미사를 붙이고 100을 곱한다.
  • rounded percentage ("p") - rounded와 비슷하지만, "%"접미사를 붙이고 100을 곱한다.
  • SI-prefix ("s") - rounded와 비슷하지만, "9.5M"나 "1.00µ"처럼 단위 접미사를 붙인다.

"n" type은 ",g"의 축약표현이다. precision 은 "f"와 "%" type으로 포맷팅된 값에서는 소수점 몇자리까지 보여주어야 하는지를 나타내고, "g", "r", "p" type으로 포맷팅된 값에서는 소수점 앞뒤로 몇자리를 보여주어야 하는지를 나타낸다.

# d3.round(x[, n])

x 를 소수점 n 자리수에서 반올림한 값을 반환한다. n 을 무시하면 기본값은 0이다. 반환값은 숫자이며 가장 가까운 10의 -n 제곱의 배수로 근사치를 잡는다. 가까운 배수가 등거리로 두 개라면, 반환값은 자바스크립트 내장 함수인 round 와 동일하게 반올림된다. 결과값을 문자열로 변환하면 IEEE 부동소수점 정확도로 인해서 부정확한 값이 될 수도 있다. 소수점 자리수를 정해서 문자열로 숫자를 포매팅할 때는 d3.format를 사용한다.

Strings

# d3.requote(string)

정규식에서 문자열 리터럴로 사용될 법한 string 의 인용부호(') 제거 버전을 반환한다.

Dates

d3.time 모듈을 참고하라.

Clone this wiki locally