글로 그리는 그림판
흐름도 · 표 관계(ER) · SVG 로 내려받기 · 문법 검사
글로 그리는 그림판
mermaid 문법으로 흐름도·표 관계를 그리고 SVG·PNG 로 저장합니다. 치는 동안 바로 그려집니다
mermaid 로 적기
흐름도 (TD) · 마디 5개 · 이어짐 4개
그림
마디 5개 · 이어짐 4개를 그렸습니다
진짜 mermaid 전부가 아니라 흐름도(flowchart·graph)와 표 관계(erDiagram)만 그립니다. subgraph·class·style 은 아직 안 읽습니다 — 못 읽은 줄은 왼쪽 아래에 그대로 적어 둡니다.
글로 적은 흐름도·표 관계를 그림(SVG)으로 그립니다. 3MB 짜리 원본 없이, 인터넷 없이 브라우저 안에서 그립니다.
이렇게도 부른다 — 머메이드 · ER다이어그램 · 다이어그램
쓰는 법
- mermaid 문법으로 적기 (flowchart 또는 erDiagram)
- 바로 그려진 그림 확인
- 문법이 틀리면 어느 줄인지 확인하고 고치기
- SVG 로 내려받아 문서에 넣기
다른 곳과 뭐가 다른가
- 인터넷 없이 그려집니다 — 라이브러리를 내려받지 않습니다.
- 문법이 틀리면 어느 줄이 문제인지 말합니다.
자주 묻는 질문
- 진짜 mermaid 와 똑같나요?
- 아닙니다. 흐름도와 표 관계 둘만 그립니다. 그 대신 3MB 짜리 라이브러리를 받지 않고, 인터넷이 끊겨도 그려집니다.
- 배치가 단순해 보이는데요?
- 일부러 그렇습니다. 화살표를 따라 깊이를 매기고 같은 깊이를 한 줄에 놓습니다 — 「누가 누구를 가리키나」가 보이면 그림의 할 일은 끝이라고 봤습니다.
- 적은 내용이 서버로 가나요?
- 안 갑니다. 읽고 그리는 것 전부 브라우저 안에서 끝납니다.
다른 도구
기기 안에서만 넣은 내용은 브라우저 안에서만 처리되며 어디에도 저장·전송되지 않습니다.