Mermaid Editor

Mermaid urejevalnik v živo, vizualno in koda na enem mestu

Večina urejevalnikov mermaid ti da polje za besedilo in predogled. Ta ti da tudi platno: klikni za dodajanje bloka, povleci puščico, združi stvari v področja — mermaid koda pa se napiše sama. Preklopi na zavihek s kodo in jo uredi ročno; platno sledi.

  • Izrisuje se med tipkanjem

    Pravi mermaid pogon, ki diagram na novo izriše nekaj sto milisekund po zadnji tipki.

  • Koda in platno v sinhronizaciji

    Uredi katero koli stran; druga se dohiti — brez kopiranja med dvema orodjema.

  • 14 oblik vozlišč

    Pravokotnik, zaobljen, tabletka, krog, romb, baza podatkov, šesterokotnik in drugo, vsako z enim klikom.

  • Brezplačno, brez registracije

    Brez poskusnega obdobja in vodnega žiga — urejevalnik se odpre takoj. Prijavite se le, če želite več kot en diagram.

Platno, ne le polje za besedilo

Vizualni zavihek je pravi urejevalnik nad izrisanim diagramom: klikni vozlišče, da ga izbereš, dvoklikni, da ga preimenuješ na mestu, povleci kamor koli za premikanje pogleda.

  • Klikni in zgradiDodaj blok, usmeri puščico na drugega, jo označi. Brez sintakse, ki bi si jo moral zapomniti, preden začneš.

  • Izberi oblikoŠtirinajst oblik flowcharta v mermaidu — odločitveni rombi, valji baz podatkov, podprocesi — v enem izbirniku.

  • Pobarvaj karkoliOsem prednastavljenih barv in izbirnik barv, uporabljena na eno vozlišče ali na celo področje.

Mermaid koda, ki ostane tvoja

Besedilni zavihek je navadna mermaid koda — enaka sintaksa, ki jo že izrisujejo GitHub, GitLab, Notion in Obsidian. Nič od tega ni lastniški format.

  • Piši ročnoVpiši mermaid neposredno in opazuj izris. Šest pripravljenih primerov za začetek.

  • Deluje v obe smeriPrilepljeni flowcharti se razčlenijo nazaj na platno — vozlišča, oblike, barve, podgrafi, vse.

  • Vsaka vrsta diagramaFlowchart, sekvenčni, razredni, stanjski, ER, gantt, git graf, tortni — predogled izriše vse, kar podpira mermaid.

Veliki diagrami ostanejo berljivi

Arhitekturni diagrami hitro presežejo en zaslon. Premikanje pogleda, povečava in združevanje so zasnovani prav za to, ne za boj proti temu.

  • Področja in gnezdenjeZdruži bloke v podgrafe, vnesi eno področje v drugo, premakni celo poddrevo z eno potezo.

  • Povečava od 2 % do 1600 %Drsi za premikanje pogleda, ctrl+drsenje za povečavo, ali ponovno centriraj z enim gumbom.

  • Shranjeno sprotiDiagram se med urejanjem samodejno shrani v vaš brskalnik. Če se prijavite, se shrani v vaš račun in vas spremlja na vsaki napravi.

Izvozi in pojdi naprej

Nič ni zaklenjeno. Vzemi sliko, vzemi izvorno kodo ali vzemi blok Markdown, pripravljen za lepljenje v dokument.

  • Brez plačilnega ziduVsaka funkcija, tudi izvoz, je brezplačna. Ni plačljivega paketa, na katerega bi bilo treba nadgraditi.

  • Se izriše v vašem brskalnikuIzris poteka v vašem brskalniku; brez računa diagram nikoli ne zapusti brskalnika, z računom pa vas shranjeni dokument spremlja na vsaki napravi.

  • SVG, PNG, .mmd, .mdKopiraj SVG kodo, prenesi 2x PNG, shrani izvorno kodo mermaid ali vzemi blok kode Markdown.

Kako se primerja z običajnimi možnostmi

Orodja diagram-kot-koda te silijo, da vse napišeš ročno. Orodja povleci-in-spusti ti dajo sliko, ki je ne moreš primerjati (diff). To orodje noče izbrati strani.

Začetek

IQ Mermaid: Dvoklikni na platno in vozlišče se pojavi. Sintakso se lahko naučiš pozneje — ali nikoli.

Tipično orodje: Najprej preberi referenco sintakse, ali se sprijazni z orodjem za risanje brez kakršnega koli besedilnega zapisa.

Izhodni format

IQ Mermaid: Navadna mermaid koda — isto besedilo, ki ga GitHub, GitLab in Notion izrisujejo domače.

Tipično orodje: Lastniška datoteka, ki se odpre le v orodju, ki jo je ustvarilo.

Poznejše urejanje

IQ Mermaid: Spremeni kodo ali premakni bloke. Obe smeri delujeta na istem diagramu.

Tipično orodje: Le ena smer: orodja, ki dajo prednost kodi, nimajo platna, orodja, ki dajo prednost platnu, nimajo izvorne kode.

Cena

IQ Mermaid: Brezplačno — niti e-pošte ne potrebujete.

Tipično orodje: Brezplačna raven omejena na nekaj diagramov, izvoz ali sodelovanje pa za naročnino.

Kje živijo podatki

IQ Mermaid: V vašem brskalniku ali v vašem računu, če želite, da vas spremlja na vsaki napravi.

Tipično orodje: Račun na tujem strežniku, kamor so pripeti tvoji diagrami.

Vprašanja o urejevalniku mermaid

Za začetek je dovolj, da odprete stran.

Kaj je mermaid?

Mermaid je besedilna sintaksa za diagrame: opišeš vozlišča in puščice v nekaj vrsticah, izrisovalnik pa nariše sliko. GitHub, GitLab, Notion in Obsidian ga izrisujejo znotraj Markdowna, zato blok mermaid ostane berljiv v pull requestu ali strani wikija.

Je ta mermaid urejevalnik res brezplačen?

Da. Vse funkcije, vključno z izvozom v SVG in PNG, so brezplačne in urejevalnik lahko uporabljate, ne da bi karkoli ustvarili. Neobvezen brezplačen račun doda več shranjenih diagramov in sinhronizacijo med napravami — plačljivega načrta ni in nič ni zadržano.

Ali moram poznati sintakso mermaid?

Ne. Začni na vizualnem zavihku: dvoklikni na platno, da dodaš blok, ga izberi in nariši puščico do drugega. Mermaid koda se ustvari samodejno, prebereš pa jo lahko kadar koli, če se želiš naučiti sintakse.

Katere vrste diagramov so podprte?

Zavihek s kodo izriše vse, kar podpira mermaid — flowchart, sekvenčni, razredni, stanjski, entitetno-razmerjski, gantt, git graf, tortni diagram in več. Vizualno platno ureja predvsem flowcharte, ki so tudi najpogostejša vrsta diagrama.

Lahko izvozim v PNG ali SVG?

Da. Kopiraj SVG kodo v odložišče, prenesi datoteko SVG, ali prenesi PNG, izrisan v 2x ločljivosti za predstavitve in dokumente. Izvorno kodo mermaid lahko shraniš tudi kot .mmd ali kot blok Markdown.

Kje je shranjen moj diagram?

Brez računa se vaš edini diagram shrani v brskalnik, zato je tam, ko se vrnete na isto napravo. Če se prijavite, se shrani v vaš račun in vas lahko spremlja na drugo napravo. Izvozite izvorno kodo, če želite svojo kopijo.

Lahko prilepim obstoječi mermaid diagram?

Da. Prilepi ga v zavihek s kodo; flowchart se razčleni nazaj na vizualno platno z ohranjenimi vozlišči, oblikami, barvami in podgrafi. Druge vrste diagramov se izrišejo v predogledu, a ostanejo samo kot koda.

Ali deluje brez povezave?

Upodabljanje v celoti poteka v brskalniku, zato po nalaganju urejevalnik deluje tudi brez povezave.

Odpri urejevalnik. Brezplačno — brez registracije.

Prazno platno, zavihek s kodo in vse možnosti izvoza — brezplačno, v brskalniku, takoj.