reaviz

(★ 1,249)

📊 Data visualization library for React. Maintained by @goodcodeus.

파일 탐색기

최종 버전 다운로드 (.zip)

- - build.yml
  - npm-publish.yml
- FUNDING.yml
- ISSUE_TEMPLATE.md
- PULL_REQUEST_TEMPLATE.md
- stale.yml
- - reaviz.svg
- - formatCode.ts
- main.ts
- manager-head.html
- manager.ts
- preview-head.html
- preview.tsx
- tailwind.css
- test-runner.ts
- theme.ts
- settings.json
- - AreaChartBlocksDarkLarge.story.tsx.snap
  - AreaChartBlocksDarkMedium.story.tsx.snap
  - AreaChartBlocksDarkSmall.story.tsx.snap
  - AreaChartBlocksDarkXSmall.story.tsx.snap
  - AreaChartBlocksLightLarge.story.tsx.snap
  - AreaChartBlocksLightMedium.story.tsx.snap
  - AreaChartBlocksLightSmall.story.tsx.snap
  - AreaChartBlocksLightXSmall.story.tsx.snap
  - BarChartBlocksDarkLarge.story.tsx.snap
  - BarChartBlocksDarkMedium.story.tsx.snap
  - BarChartBlocksDarkSmall.story.tsx.snap
  - BarChartBlocksDarkXSmall.story.tsx.snap
  - BarChartBlocksLightLarge.story.tsx.snap
  - BarChartBlocksLightMedium.story.tsx.snap
  - BarChartBlocksLightSmall.story.tsx.snap
  - BarChartBlocksLightXSmall.story.tsx.snap
  - FunnelChartBlocksDarkLarge.story.tsx.snap
  - FunnelChartBlocksDarkMedium.story.tsx.snap
  - FunnelChartBlocksDarkSmall.story.tsx.snap
  - FunnelChartBlocksDarkXSmall.story.tsx.snap
  - FunnelChartBlocksLightLarge.story.tsx.snap
  - FunnelChartBlocksLightMedium.story.tsx.snap
  - FunnelChartBlocksLightSmall.story.tsx.snap
  - FunnelChartBlocksLightXSmall.story.tsx.snap
  - HeatmapBlocksDarkLarge.story.tsx.snap
  - HeatmapBlocksDarkMedium.story.tsx.snap
  - HeatmapBlocksDarkSmall.story.tsx.snap
  - HeatmapBlocksDarkXSmall.story.tsx.snap
  - HeatmapBlocksLightLarge.story.tsx.snap
  - HeatmapBlocksLightMedium.story.tsx.snap
  - HeatmapBlocksLightSmall.story.tsx.snap
  - HeatmapBlocksLightXSmall.story.tsx.snap
  - ScatterPlotBlocksDarkLarge.story.tsx.snap
  - ScatterPlotBlocksDarkMedium.story.tsx.snap
  - ScatterPlotBlocksDarkSmall.story.tsx.snap
  - ScatterPlotBlocksDarkXSmall.story.tsx.snap
  - ScatterPlotBlocksLightLarge.story.tsx.snap
  - ScatterPlotBlocksLightMedium.story.tsx.snap
  - ScatterPlotBlocksLightSmall.story.tsx.snap
  - ScatterPlotBlocksLightXSmall.story.tsx.snap
- AreaChartBlocksDarkLarge.story.tsx
- AreaChartBlocksDarkMedium.story.tsx
- AreaChartBlocksDarkSmall.story.tsx
- AreaChartBlocksDarkXSmall.story.tsx
- AreaChartBlocksLightLarge.story.tsx
- AreaChartBlocksLightMedium.story.tsx
- AreaChartBlocksLightSmall.story.tsx
- AreaChartBlocksLightXSmall.story.tsx
- BarChartBlocksDarkLarge.story.tsx
- BarChartBlocksDarkMedium.story.tsx
- BarChartBlocksDarkSmall.story.tsx
- BarChartBlocksDarkXSmall.story.tsx
- BarChartBlocksLightLarge.story.tsx
- BarChartBlocksLightMedium.story.tsx
- BarChartBlocksLightSmall.story.tsx
- BarChartBlocksLightXSmall.story.tsx
- FunnelChartBlocksDarkLarge.story.tsx
- FunnelChartBlocksDarkMedium.story.tsx
- FunnelChartBlocksDarkSmall.story.tsx
- FunnelChartBlocksDarkXSmall.story.tsx
- FunnelChartBlocksLightLarge.story.tsx
- FunnelChartBlocksLightMedium.story.tsx
- FunnelChartBlocksLightSmall.story.tsx
- FunnelChartBlocksLightXSmall.story.tsx
- HeatmapBlocksDarkLarge.story.tsx
- HeatmapBlocksDarkMedium.story.tsx
- HeatmapBlocksDarkSmall.story.tsx
- HeatmapBlocksDarkXSmall.story.tsx
- HeatmapBlocksLightLarge.story.tsx
- HeatmapBlocksLightMedium.story.tsx
- HeatmapBlocksLightSmall.story.tsx
- HeatmapBlocksLightXSmall.story.tsx
- ScatterPlotBlocksDarkLarge.story.tsx
- ScatterPlotBlocksDarkMedium.story.tsx
- ScatterPlotBlocksDarkSmall.story.tsx
- ScatterPlotBlocksDarkXSmall.story.tsx
- ScatterPlotBlocksLightLarge.story.tsx
- ScatterPlotBlocksLightMedium.story.tsx
- ScatterPlotBlocksLightSmall.story.tsx
- ScatterPlotBlocksLightXSmall.story.tsx
- - fav.png
  - logo-light.png
  - logo.png
  - logo.svg
  - teaser.png
- Changelog.mdx
- Intro.mdx
- Support.mdx
- android-chrome-192x192.png
- android-chrome-384x384.png
- apple-touch-icon.png
- browserconfig.xml
- favicon-16x16.png
- favicon-32x32.png
- favicon.ico
- mstile-150x150.png
- safari-pinned-tab.svg
- site.webmanifest
- stories.cjs
- - AreaChart.module.css
  - AreaChart.module.css.d.ts
  - AreaChart.tsx
  - AreaChartAxis.story.tsx
  - AreaChartCircle.story.tsx
  - AreaChartGridLines.story.tsx
  - AreaChartMarkers.story.tsx
  - AreaChartMultiSeries.story.tsx
  - AreaChartSingleSeries.story.tsx
  - index.ts
  - StackedAreaChart.tsx
  - StackedNormalizedAreaChart.tsx
- - BarChart.module.css
  - BarChart.module.css.d.ts
  - BarChart.tsx
  - BarChartAxis.story.tsx
  - BarChartGridLines.story.tsx
  - BarChartHorizontal.story.tsx
  - BarChartHorizontalMultiSeries.story.tsx
  - BarChartMarkers.story.tsx
  - BarChartVertical.story.tsx
  - BarChartVerticalHistogram.story.tsx
  - BarChartVerticalMultiSeries.story.tsx
  - HistogramBarChart.tsx
  - index.ts
  - MarimekkoChart.tsx
  - StackedBarChart.tsx
  - StackedNormalizedBarChart.tsx
- - BarList.story.tsx
  - BarList.tsx
  - BarListLabels.story.tsx
  - BarListSeries.module.css
  - BarListSeries.tsx
  - BarListSort.story.tsx
  - index.ts
- - Bubble.tsx
  - BubbleChart.story.tsx
  - BubbleChart.tsx
  - BubbleLabel.tsx
  - BubbleSeries.tsx
  - index.ts
- - index.ts
  - types.ts
- - FunnelChart.story.tsx
  - FunnelChart.tsx
  - index.ts
- - CalendarHeatmap.tsx
  - calendarUtils.ts
  - Heatmap.story.tsx
  - Heatmap.tsx
  - HeatmapCalendar.story.tsx
  - index.ts
- - index.ts
  - LinearGauge.tsx
  - LinearGaugeBar.tsx
  - LinearGaugeMultiSeries.story.tsx
  - LinearGaugeOuterBar.tsx
  - LinearGaugeSeries.tsx
  - LinearGaugeSingleSeries.story.tsx
- - index.ts
  - LineChart.tsx
  - LineChartCircle.story.tsx
  - LineChartGridlines.story.tsx
  - LineChartMarkers.story.tsx
  - LineChartMultiSeries.story.tsx
  - LineChartSingleSeries.story.tsx
  - LineSeries.tsx
- - index.ts
  - Map.story.tsx
  - Map.tsx
  - MapMarker.module.css
  - MapMarker.module.css.d.ts
  - MapMarker.tsx
- - index.ts
  - Meter.module.css
  - Meter.story.tsx
  - Meter.tsx
  - MeterColumn.tsx
- - DonutChart.story.tsx
  - index.ts
  - PieChart.story.tsx
  - PieChart.tsx
- - index.ts
  - RadarChart.story.tsx
  - RadarChart.tsx
  - RadarChartSeries.tsx
- - index.ts
  - RadialAreaChart.story.tsx
  - RadialAreaChart.tsx
  - RadialAxisAreaChart.story.tsx
  - RadialAxisLineChart.story.tsx
  - RadialLineChart.story.tsx
- - index.ts
  - RadialAxisBarChart.story.tsx
  - RadialBarChart.story.tsx
  - RadialBarChart.tsx
- - index.ts
  - RadialGauge.story.tsx
  - RadialGauge.tsx
- - index.ts
  - RadialScatterPlot.story.tsx
  - RadialScatterPlot.tsx
- - index.ts
  - Sankey.story.tsx
  - Sankey.tsx
  - utils.ts
- - index.ts
  - ScatterPlot.module.css
  - ScatterPlot.module.css.d.ts
  - ScatterPlot.tsx
  - ScatterPlotAxis.story.tsx
  - ScatterPlotLinear.story.tsx
  - ScatterPlotMarkers.story.tsx
- - AreaSparklineChart.tsx
  - BarSparklineChart.tsx
  - index.ts
  - SonarChart.tsx
  - SparklineChart.story.tsx
  - SparklineChart.tsx
- - index.ts
  - SunburstArc.tsx
  - SunburstArcLabel.tsx
  - SunburstChart.story.tsx
  - SunburstChart.tsx
  - SunburstSeries.tsx
  - useInterpolate.ts
- - index.ts
  - TreeMap.story.tsx
  - TreeMap.tsx
  - TreeMapLabel.tsx
  - TreeMapRect.tsx
  - TreeMapSeries.tsx
- - index.ts
  - useInterpolate.ts
  - VennArc.tsx
  - VennDiagram.story.tsx
  - VennDiagram.tsx
  - VennLabel.tsx
  - VennOuterLabel.tsx
  - VennSeries.tsx
- - index.ts
  - WordCloud.story.tsx
  - WordCloud.tsx
  - WordCloudLabel.module.css
  - WordCloudLabel.tsx
- index.ts
- typings.d.ts
- mockEnv.ts
.editorconfig
.gitignore
.prettierrc
CHANGELOG.md
CLAUDE.md
CODE_OF_CONDUCT.md
eslint.config.ts
LICENSE
package-lock.json
package.json
postcss.config.mjs
README.md
tsconfig.json
vite.config.ts

# 설치 가이드

1. 코드 내려받기

git clone https://github.com/reaviz/reaviz

깃허브에서 프로젝트 코드 전체를 내 컴퓨터로 내려받습니다.

cd reaviz

방금 내려받은 프로젝트 폴더 안으로 이동합니다.

2. Node.js

쉬움 추천

사전 준비물

Git GitHub에서 프로젝트 코드를 내려받으려면 필요합니다.
Node.js npm 명령어를 쓰려면 Node.js가 설치되어 있어야 합니다. LTS(장기지원) 버전을 추천합니다.

npm i reaviz --save

이 명령어를 터미널에 그대로 입력해 실행하세요.

<img src="https://img.shields.io/npm/v/reaviz.svg" />

이 명령어를 터미널에 그대로 입력해 실행하세요.

<img src="https://badgen.net/npm/dw/reaviz" />

이 명령어를 터미널에 그대로 입력해 실행하세요.

✅ 명령어 실행 후 터미널에 나타나는 주소(보통 http://localhost:3000 형태)를 브라우저에서 열어보세요.

이 레포의 README에 적힌 실제 명령어를 그대로 가져왔습니다.

reaviz

파일 탐색기

# 설치 가이드

2. Node.js

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

reaviz

파일 탐색기

# 설치 가이드

2. Node.js

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

Download README