Reladraw, "A 오른쪽에" 말로 배치하는 다이어그램 언어 Show HN 등장

Reladraw 보니까 Pikchr가 좀 떠오르네. https://pikchr.org/home/doc/trunk/homepage.md

마음에 드는데, 나는 Mermaid로 한 문제가 좀 많았거든. 복잡해지면 걔가 대충 지멋대로 배치해놔서 결국 Draw.io를 열게 되지.

이거 진짜 개쩔어. 고마워. Mermaid랑 사투 벌이는 거 진짜 짜증나는데, 특히 일반 문법이랑 GitHub 문법이 따로 노는 거. 여기저기 굴러다니는 반쯤 구현된 임시 도구 몇 개 버리고 이걸로 갈아탈 듯.

이거 사실상 tikz positioning library(right=of, below left=of)에서 라텍스 빼놓은 거 같은데? tikz에서 아팠던 건 노드가 아니라 간선이었어. 두 간선이 같은 쪽 면을 원하면 순식간에 지저분해지거든. 라우팅도 처리해주나, from:/to: 말고는 없는 건가? 그리고 지시가 충돌하면 첫 게 이기나, 아니면 오류 나나?

질문 고마워! 장애물 우회 자동 라우팅은 없어. 다만 A, B, C에서 D 왼쪽 면으로 간선이 몰리면 그 면을 나눠 쓰면서 서로 겹치지 않게 벌려 주고, 면이 좉으면 밖으로 휘면서 자리를 만든다. '이 간선은 두 노드 사이를 지나가서 D로 가라' 같은 라우팅 지시도 줄 수 있고. 충돌은 양립 가능한 지시는 전부 적용하고, 안 되면 충돌한 문장을 오류로 알려준다. 뭔가가 조용히 이기지는 않아.

이런 거 찾고 있었는데 테마가 좀 있으면 좋겠다. 그게 제일 아쉽네.

좋은 생각! 지금은 어두운 테마 비슷한 게 기본이고 배경색이나 스타일 직접 정하는 것밖에 없는데, 프리셋 테마 만드는 걸 우선으로 해볼게.

재밌다. 내가 Copilot 시켜서 .dot 다이어그램 스크립트 만들었을 때, 직접 그릴 때랑 똑같은 배치 문제를 겪는 거 보고 웃었거든.

고마워! .dot은 레이아웃 엔진이 위치를 결정하잖아. 그러면 에이전트가 결과물이 어떻게 생겼는지 모르니까 렌더-확인-수정 루프가 생기고, 배치에 신경 쓸수록 .dot 노브로는 원하는 대로 못 맞추기도 하고. Reladraw는 사람이나 에이전트가 그냥 '이 노드를 저 노드 오른쪽에 둬라'고 말하게 하자는 거야. 에이전트한테는 수정을 덜 하게 되겠지!

이거 너무 좋아. Mermaid에 들어갔으면 좋겠어. 난 항상 배치 때문에 치였는데, 에이전트들은 대충 작업하거나 아예 SVG를 갖다 쓰더라고.

Mermaid도 멋지지만 나도 상대 배치가 되는 걸 원했어. Claude 시켜서 HTML로 인포그래픽 만들거나 SVG 쓰는 것도 해봤는데, 단순하면 꽤 그럴듯하지만 복잡해지면 엉망이 되더라고. 에이전트는 원하는 걸 말하게 하고 계산은 도구에 맡기자. 좌표 다시 계산하는데 토큰 태울 필요 없지.

차라리 라텍스 없이 tikz를 구현해줬으면 좋겠다. 이렇게 단순하면서도 가장 복잡한 걸 만들 만큼 깊이 있는 그리기 라이브러리를 아직 못 봤거든.

tikz는 정말 강력해 보여. Reladraw는 범위를 좁게 잡았어. 상자, 그룹, 화살표로 다이어그램 그릴 때 상대 위치를 말하면 Reladraw가 나머지 일을 대신해주는 정도야.

야 내 마음 읽었냐? ㅋㅋ 겁나 멋지네. 나 다이어그램이랑 차트 엄청 좋아해서 일도 취미도 쓰는데 이건 안 써볼 수가 없다.

좀 버그가 있는 듯. `edge parser -> renderer