숫자와 날짜

축 눈금은 짧게, 툴팁·표는 정확하게 적는 것이 기본입니다. 한국어 페이지에서 축은 1.2만 · 3.4억 · 6,000만, 툴팁은 123,456,789원처럼 쉼표가 들어간 전체 숫자입니다.

numberFormat

축 눈금만 따로 바꾸려면 yAxis: { format } (또는 xAxis) 에 같은 값을 줍니다. 숫자 도우미는 따로 꺼내 쓸 수도 있습니다.

import { korean, compact, comma } from '@82chart/core';
korean(123456789);  // '1.2억'
compact(123456789); // '123.5M'
comma(1234.5);      // '1,234.5'

"단위: 백만원" 보고서 방식

공공 자료·보고서처럼 축을 백만원 단위 쉼표 숫자로 쓰고 싶다면 scale 로 나누고 unit 을 붙입니다. scale 이 있으면 축·툴팁·표가 모두 나눈 숫자에 단위를 붙여 적고, 머리 숫자(value)는 원래 금액 그대로입니다. footnote 로 단위를 밝혀 두세요.

createChart('#chart', {
  type: 'bar',
  title: '사업부별 매출',
  scale: 1000000,
  unit: '백만원',
  footnote: '단위: 백만원',
  data: {
    labels: ['국내', '해외', '온라인', '도매'],
    series: [{ name: '매출', data: [1820000000, 940000000, 2310000000, 610000000] }],
  },
});

날짜 모양

날짜 축의 라벨은 간격에 맞게 정해집니다. 월 단위면 1월 · 2월 (해가 바뀌면 2027년 1월), 일 단위면 10.21, 시간 단위면 09:00. 툴팁은 2026.10.21(화) 처럼 요일까지 씁니다. 직접 정하려면 dateFormat 에 패턴을 넘깁니다.

createChart('#chart', {
  type: 'line',
  dateFormat: 'MM/DD(ddd)', // 10/21(화)
  data: { series: [{ name: '방문자', data: [['2026-10-20', 1820], ['2026-10-21', 2140]] }] },
});

dateFormat 은 축과 툴팁에 함께 쓰입니다. 'auto' 는 기본 동작입니다.

시간대 (timeZone)

날짜는 기본으로 실행 환경의 시간대로 읽고 적습니다. 브라우저에서는 보통 문제가 없지만, 서버(Cloudflare Workers, 대부분의 Node 서버)는 UTC 라서 renderToSVG 로 그리면 한국 자정 데이터가 전날로 찍힙니다. timeZone 에 IANA 이름을 주면 축·툴팁·표·CSV 가 모두 그 시간대로 적힙니다. '2026-10-21' 처럼 날짜만 있는 문자열은 그 시간대의 그날, 시차 표시가 없는 '2026-10-21T09:00' 은 그 시간대의 9시로 읽습니다.

createChart('#chart', {
  type: 'line',
  timeZone: 'Asia/Seoul', // 어디서 실행해도 한국 시간
  data: { series: [{ name: '주문', data: [['2026-10-21T00:00:00Z', 120], ['2026-10-21T06:00:00Z', 180]] }] },
});

시간대 이름이 틀리면 경고를 한 번 남기고 실행 환경의 시간대로 그립니다. 내보낸 숫자 도우미 formatDate(date, pattern, locale, timeZone) 도 네 번째 인자로 시간대를 받습니다.