TimeSeriesTooltip

visual

Read full timestamps and time zones, sorted values, totals, comparison deltas, and incomplete-bucket warnings.

100%

Hover the chart. Series are ranked by value, so the eye does not have to chase the legend order.

2026년 7월 9일

생성된 테스트 결과를 찾지 못했습니다.

TimeSeriesTooltipContent 항목이 문서 메타에 연결되어 있지만 현재 생성 파일에는 없습니다.

테스트를 추가한 뒤 `bun run generate:test-results`를 실행하거나 `testDescribe` 매핑을 다시 확인하세요.

Prop	타입	기본값	설명
`active`	`boolean`	—	Recharts가 넘기는 활성 여부. 툴팁으로 쓸 때 직접 주지 않는다
`payload`	`ReadonlyArray<TooltipEntry>`	—	Recharts가 넘기는 해당 지점의 시리즈 값들
`label`	`React.ReactNode`	—	Recharts가 넘기는 축 레이블
`granularity`	`TimeGranularity`	`"day"`	버킷 단위 (타임스탬프 정밀도 결정)
`timeZone`	`string`	—	타임스탬프를 읽을 IANA 타임존
`locale`	`string`	—	축·툴팁의 시각 표기에 쓰는 로케일. 생략하면 브라우저 기본값
`showTimeZone`	`boolean`	`false`	시각 옆에 시간대 이름을 함께 표시할지 여부
`sortByValue`	`boolean`	`true`	값 내림차순 정렬
`showTotal`	`boolean`	`false`	표시 중인 시리즈 합계 행
`maxItems`	`number`	`12`	표시할 시리즈 최대 개수
`comparisonKeys`	`Readonly<Record<string, string>>`	—	비교 시리즈 dataKey → 대상 dataKey 매핑
`now`	`number`	—	"지금"으로 볼 시각 (ms). 미완 구간 판정에 쓰인다
`valueFormatter`	`(value: number, dataKey: string) => ReactNode`	—	값 포매터
`labels`	`TimeSeriesTooltipLabels`	—	툴팁이 직접 쓰는 문자열 (합계·미완 구간·더 보기). 지역화 지점
`className`	`string`	—	루트 요소에 붙는 CSS 클래스

tsx

import { TimeSeriesTooltipContent, createTimeSeriesTooltip } from "@reopt-ai/opt-ui";