다국어 지원

Charturbo는 내장 문구를 영어, 한국어, 중국어 간체로 제공합니다. 로캘 설정 하나가 숫자·날짜 형식(Intl)과 라이브러리가 직접 쓰는 모든 문구를 함께 정합니다. 접근성 요약과 키보드 도움말, 스크린 리더 안내, 데이터 표 제목과 머리글, CSV 머리글, 기본 툴팁, 범례·브레드크럼 라벨, 기본 시리즈 이름이 여기에 해당합니다.

직접 넘긴 텍스트(제목, 시리즈 이름, 항목 라벨)는 그대로 표시합니다.

로캘 설정

import { Charturbo } from 'charturbo';

// SDK 인스턴스 전체
const sdk = await Charturbo.create(canvas, { locale: 'ko-KR' });

// 나중에 변경: 라벨, 툴팁, 접근성 문구가 바로 갱신됩니다
sdk.setLocale('zh-CN');

// 차트별 (선, 영역, 캔들스틱, OHLC, 히스토그램, 콤보 차트가 `locale`을 받습니다)
sdk.renderLineChart(series, { locale: 'en-US' });

차트에 적용되는 로캘은 아래 순서로 정합니다.

차트의 locale 옵션
SDK 로캘 (create({ locale }) 또는 setLocale)
페이지 언어: <html lang="...">
브라우저 언어: navigator.language

팁

페이지에 <html lang>을 지정하세요. 스크린 리더가 이 값으로 음성을 고르고, Charturbo도 코드 없이 이 값을 따릅니다.

지원 언어

로캘 태그	내장 문구
`en`, `en-*`, 내장 문구가 없는 모든 언어	영어
`ko`, `ko-*`	한국어
`zh`, `zh-*` (`zh-TW`, `zh-HK` 포함)	중국어 간체

숫자와 날짜는 항상 지정한 태그 전체를 씁니다. 그래서 de-DE는 독일식 숫자 형식에 영어 문구가 되고, zh-TW는 대만식 숫자 형식에 간체 문구가 됩니다. 번체 문구가 필요하면 아래처럼 등록하세요.

import { CHARTURBO_LANGUAGES, resolveLanguage } from 'charturbo';

CHARTURBO_LANGUAGES;      // ['en', 'ko', 'zh-CN']
resolveLanguage('ko-KR'); // 'ko'
resolveLanguage('fr');    // 'en'

문구 바꾸기와 언어 추가

registerMessages(locale, messages)는 내장 문구를 바꾸거나, 영어를 바탕으로 새 언어를 추가합니다. 문구는 표시하는 위치별로 묶여 있습니다(common, a11y, core, box, combo, business, hierarchy, sparkline). 바꿀 키만 넘기면 됩니다.

import { registerMessages } from 'charturbo';

// 한국어 단어 하나를 전체에서 변경
registerMessages('ko', { common: { total: '총계' } });

// 일본어 추가 (지정하지 않은 키는 영어로 남습니다)
registerMessages('ja', {
  common: {
    total: '合計',
    value: '値',
    seriesName: (index) => `系列 ${index}`,
    position: (i, n) => `${n} 件中 ${i} 件目。`,
  },
});

sdk.setLocale('ja-JP');

pt-BR 같은 태그는 내장 언어(영어) → pt로 등록한 문구 → pt-BR로 등록한 문구 순서로 찾습니다.

어순과 복수형이 언어마다 달라서 일부 문구는 함수입니다. 인자는 차트 로캘로 이미 형식화된 문자열이고, 복수형이 필요한 경우 원래 개수가 함께 들어옵니다.

registerMessages('en', {
  common: { points: (n, count) => `${count} ${n === 1 ? 'sample' : 'samples'}` },
});

등록한 문구는 이후에 렌더링하거나 갱신하는 차트부터 적용됩니다. 현재 차트에 바로 반영하려면 sdk.setLocale(sdk.getLocale())를 호출하세요.

전체 키는 현재 문구를 읽어서 확인할 수 있습니다.

import { getMessages } from 'charturbo';

const m = getMessages('ko');
console.log(Object.keys(m.a11y));

CharturboMessages 타입에 모든 그룹과 키가 정의되어 있어 에디터 자동 완성이 됩니다.

번역하지 않는 것

개발자용 오류 메시지(Error, CharturboInitError)는 검색할 수 있도록 영어로 둡니다.
기본 다운로드 파일 이름(chart.png, chart.svg)
숫자 형식의 단위 기호(k, M, KB)

예제 사이트와 문서

예제 사이트와 이 문서도 세 언어로 볼 수 있습니다. 각 페이지 위쪽의 언어 메뉴를 쓰세요.

다국어 지원 ​

로캘 설정 ​

지원 언어 ​

문구 바꾸기와 언어 추가 ​

번역하지 않는 것 ​

예제 사이트와 문서 ​

함께 보기 ​