reopt designreopt design
DocsExploreToolsPricingBuilder
시작하기
개요
시작하기
핵심 개념
핵심 개념
데이터 모델
데이터 모델
구축·운영
Production readiness
opt-charts · Charts
ChartContainer
ChartTooltip
ChartLegend
LineChart
BarChart
AreaChart
Sparkline
PieChart
ScatterChart
ComparisonChart
GaugeChart
FunnelChart
RetentionHeatmap
SankeyChart
CalendarHeatmap
WaterfallChart
BubbleChart
ComposedChart
RadarChart
RadialBarChart
Treemap
Histogram
BoxPlot
BulletChart
Heatmap
DataBar
GanttChart
Sunburst
CandlestickChart
MetricsCard
TrendChart
EventSparkline
ReportWidget
Oopt-charts
reopt designreopt design

AI 시대를 위한 디자인 시스템

  • 문서
  • 가격
  • 릴리즈 노트
  • GitHub
  • 서비스 약관
  • 개인정보처리방침

© 2026 reopt-ai. All rights reserved.

Heatmap

visual

범용 매트릭스 히트맵. 행×열 값 강도를 색으로 표현합니다(상관행렬·밀도 등).

100%

상관 행렬

매출방문체류전환
매출10.820.31-0.12
방문0.8210.470.05
체류0.310.4710.63
전환-0.120.050.631

활동 밀도

요일 × 시간대

6912151821
금2581294
토371115105
일14914126

테스트 커버리지

2026년 7월 9일

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

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

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

Heatmap Props

Prop타입기본값설명
data*number[][]—행×열 값 매트릭스
xLabelsstring[]—열 레이블
yLabelsstring[]—행 레이블
showValuesbooleanfalse셀 값 표시 여부
colorScale[string, string]—저→고 색상 (기본: 테마 sequential 토큰)

Import

tsx
import { Heatmap } from "@reopt-ai/opt-ui";