BoxPlot
visualSummarize minimum, quartiles, median, maximum, and outliers in responsive boxes with keyboard access to the values.
100%
실험군 분포 비교
이상치 숨김
showOutliers=false
테스트 커버리지
2026년 7월 9일생성된 테스트 결과를 찾지 못했습니다.
BoxPlot 항목이 문서 메타에 연결되어 있지만 현재 생성 파일에는 없습니다.
테스트를 추가한 뒤 `bun run generate:test-results`를 실행하거나 `testDescribe` 매핑을 다시 확인하세요.
BoxPlot Props
| Prop | 타입 | 기본값 | 설명 |
|---|---|---|---|
data* | BoxPlotDatum[] | — | 그룹 배열 (name, values 또는 사전 계산 통계). 사전 계산값에 사분위가 빠지면 박스를 그리지 않고 표에만 남긴다 |
height | number | 300 | 차트 높이(px) |
color | string | "var(--opt-chart-1)" | 박스 색상 |
showOutliers | boolean | true | 이상치 점 표시 여부 |
showGrid | boolean | true | 가로 그리드 표시 여부. 눈금 레이블은 항상 남는다 |
valueFormatter | (value: number) => string | — | 값을 표시 문자열로 바꾸는 함수. 기본은 locale 인식 숫자 포맷 |
accessibleTable | boolean | false | 스크린 리더용으로 숨긴 데이터 표를 함께 렌더링 |
labels | BoxPlotLabels | — | 지역화 문자열 (empty·summaryCaption·chartName·groupColumn·min·q1·median·q3·max·outliers) |
locale | string | — | 기본 숫자 포맷에 쓰는 locale. 생략하면 런타임 locale |
loading | boolean | false | 새 데이터를 불러오는 동안 현재 렌더를 흐리게 유지 |
emptyState | React.ReactNode | — | 데이터가 없을 때 보여줄 내용. 기본은 labels.empty |
className | string | — | 루트 요소에 붙는 CSS 클래스 |
aria-label | string | — | 스크린 리더용 레이블. 생략하면 차트 종류와 항목 이름으로 만든다 |
aria-describedby | string | — | 차트를 설명하는 요소의 id |
Import
tsx
import { BoxPlot } from "@reopt-ai/opt-ui";