Mermaid 파이 차트 뷰어
브라우저에서 Mermaid 파이 차트를 즉시 렌더링하세요. 비율 데이터를 시각화하고 SVG 또는 PNG로 내보내세요. 무료 온라인 도구입니다.
다이어그램을 미리 보려면 Mermaid 코드를 입력하세요
파이 차트는 시장 점유율, 예산 배분, 트래픽 소스, 기능 사용량 또는 설문 조사 결과와 같이 비율 분포를 한눈에 전달합니다. Mermaid의 `pie` 구문은 모든 Mermaid 다이어그램 유형 중에서 가장 간단합니다. 제목과 레이블-값 쌍 목록만 있으면 됩니다. 이러한 단순성 덕분에 사용자가 빠른 데이터 시각화를 요청할 때 AI 어시스턴트의 빈번한 출력물이 파이 차트입니다. 제품 관리자가 Claude 또는 ChatGPT에 '사용자 확보 채널 분석을 보여줘'라고 묻거나 개발자가 'API 로그의 HTTP 오류 코드 분포를 시각화해줘'라고 물을 때 종종 Mermaid 파이 차트를 받게 됩니다. Zolkit은 차트를 즉시 렌더링하여 보고서나 프레젠테이션을 위해 내보내기 전에 레이블, 비율 및 전반적인 시각적 인상을 확인할 수 있습니다. Mermaid 파이 차트는 원시 값을 기반으로 백분율을 자동으로 계산하고 각 조각에 해당 레이블을 지정합니다. 이 뷰어는 웹 임베딩을 위한 선명한 SVG 또는 슬라이드 덱, Word 문서 및 이메일 보고서에 포함하기 위한 2배 PNG로 내보냅니다. 더 복잡한 데이터 시각화 요구 사항의 경우, 파이 차트를 Gantt 차트(타임라인 분포용) 또는 타임라인 다이어그램과 함께 사용하는 것을 고려해 보세요.
무료 온라인 Mermaid 다이어그램 뷰어 및 내보내기 도구
Zolkit의 Mermaid 다이어그램 뷰어를 사용하면 설치, 가입, 서버 업로드 없이 모든 Mermaid 코드를 붙여넣고 렌더링된 다이어그램을 즉시 확인할 수 있습니다. 모든 작업이 브라우저에서 실행되므로 Claude, ChatGPT 또는 Gemini에서 생성된 AI 다이어그램을 확인하는 가장 빠른 방법입니다. 순서도, 시퀀스 다이어그램, 클래스 다이어그램, ER 다이어그램, 간트 차트, 상태 다이어그램, 마인드맵, Git 그래프, 파이 차트, 타임라인 등 모든 주요 Mermaid 다이어그램 유형을 지원합니다.
즉각적인 실시간 미리보기
입력하는 동안 다이어그램이 자동으로 렌더링되며, 300ms 디바운스를 적용하여 느리게 느껴지지 않습니다.
100% 개인 정보 보호
모든 렌더링은 mermaid.js를 사용하여 브라우저에서 이루어집니다. 코드는 어떤 서버로도 전송되지 않습니다.
SVG 및 PNG 내보내기
문서 및 슬라이드에 적합한 선명한 벡터 SVG 또는 고해상도 2× PNG로 다이어그램을 다운로드하세요.
모든 Mermaid 다이어그램 유형 지원
순서도, 시퀀스 다이어그램, 클래스 다이어그램, ER 다이어그램, 간트 차트, 마인드맵, Git 그래프 등 다양한 다이어그램 유형을 지원합니다.
AI 다이어그램 준비 완료
AI 시대를 위해 제작되었습니다. Claude, ChatGPT, Gemini 또는 기타 LLM에서 생성된 다이어그램을 직접 미리 볼 수 있습니다.
항상 무료
계정 필요 없음, 사용량 제한 없음, 워터마크 없음. Zolkit의 Mermaid 뷰어는 영원히 완전 무료입니다.
Mermaid 다이어그램 미리보기 방법
- 1
왼쪽 편집기에 Mermaid 코드를 붙여넣으세요. AI 어시스턴트에서 복사하거나 수동으로 작성할 수 있습니다.
- 2
다이어그램이 오른쪽 미리보기 창에 즉시 렌더링됩니다. 구문 오류가 있으면 해당 문제가 설명된 메시지가 표시됩니다.
- 3
'SVG 내보내기' 또는 'PNG 내보내기'를 클릭하여 문서, 슬라이드 또는 공유에 사용할 수 있는 파일 형식으로 다이어그램을 다운로드하세요.
자주 묻는 질문
Mermaid 파이 차트는 어떻게 작성하나요?
첫 줄에 `pie title 제목`으로 시작한 다음, 각 조각을 별도의 줄에 `"레이블" : 값` 형식으로 나열합니다. 값은 양수이면 무엇이든 가능합니다. Mermaid는 자동으로 백분율로 변환합니다. 예: `pie title 브라우저 점유율 \n "Chrome" : 65.2 \n "Safari" : 19.1 \n "Firefox" : 4.0`. 값이 100이 되도록 맞출 필요는 없습니다.
각 조각의 색상을 제어할 수 있나요?
Mermaid 파이 차트는 다이어그램 테마에 따라 자동 할당된 색상 팔레트를 사용합니다. 다이어그램 구문에서 조각별 색상을 직접 지정할 수는 없습니다. 색상을 사용자 지정하려면 사용자 지정 Mermaid 테마를 적용하거나 SVG 출력을 후처리해야 합니다. 특정 브랜드 색상이 필요한 프레젠테이션의 경우, Figma 또는 Inkscape와 같은 벡터 편집기에서 내보낸 SVG를 편집하는 것이 가장 실용적인 접근 방식입니다.
Mermaid 파이 차트의 최대 조각 수는 몇 개인가요?
엄격한 제한은 없지만, 7~8개 이상의 조각이 있으면 각 부분이 너무 좁아 명확하게 레이블을 지정하기 어려워져 읽기 어렵습니다. 개별 조각이 전체의 3~5% 미만을 차지하는 경우 작은 범주를 '기타'로 그룹화하는 것이 가장 좋습니다. Mermaid는 어떤 수의 조각이든 렌더링하려고 시도하지만, 10개 이상에서는 가독성이 크게 저하됩니다.
파이 차트와 Gantt 차트 또는 타임라인을 언제 사용해야 하나요?
단일 시점의 부분 대 전체 관계(비율, 분포, 점유율)를 보여주고 싶을 때 파이 차트를 사용합니다. 작업, 기간 및 시간 축에 걸친 일정을 보여주어야 할 때 Gantt 차트를 사용합니다. 특정 이벤트를 연대순으로 표시하고 싶을 때 타임라인을 사용합니다. 파이 차트는 '전체의 얼마인가?'에 답하고, Gantt 및 타임라인 차트는 '언제?'에 답합니다.