Mermaid Editor

Tasuta mermaid redaktor veebis, visuaal ja kood ühes kohas

Enamik mermaid redaktoreid annab sulle tekstivälja ja eelvaate. See annab ka lõuendi: klõpsa, et lisada plokk, lohista nool, rühmita asjad aladeks — ja mermaid kood kirjutab end ise. Lülitu koodisakile ja muuda seda käsitsi; lõuend järgib.

  • Renderdub sinu kirjutades

    Päris mermaid mootor, joonistatakse uuesti mõnisada millisekundit pärast viimast klahvivajutust.

  • Kood ja lõuend sünkroonis

    Muuda kumbagi poolt. Teine jõuab järele — kahe tööriista vahel copy-paste'i pole vaja.

  • 14 sõlme kuju

    Ristkülik, ümardatud, pill, ring, romb, andmebaas, kuusnurk ja teised, igaüks ühe klõpsuga.

  • Tasuta, ilma registreerimiseta

    Pole prooviperioodi ega vesimärki — redaktor avaneb kohe. Logi sisse vaid siis, kui soovid rohkem kui üht diagrammi.

Lõuend, mitte lihtsalt tekstiväli

Visuaalne sakk on päris redaktor renderdatud diagrammi peal: klõpsa sõlmel, et see valida, topeltklõpsa, et see kohapeal ümber nimetada, lohista kuhu tahes, et panoraamida.

  • Klõpsa ja ehitaLisa plokk, suuna nool teisele, märgista nool. Enne alustamist pole vaja süntaksit teada.

  • Vali kujuNeliteist mermaid vookaardi kuju — otsustusrombid, andmebaasisilindrid, alamrutiinid — ühest valijast.

  • Värvi ükskõik midaKaheksa eelseadistust pluss värvivalija, rakendatuna ühele sõlmele või tervele alale.

Mermaid kood, mis jääb sinu omaks

Tekstisakk on tavaline mermaid — sama süntaks, mida GitHub, GitLab, Notion ja Obsidian juba renderdavad. Siin pole midagi omanduslikku formaati.

  • Kirjuta käsitsiKirjuta mermaid otse ja vaata, kuidas see renderdub. Kuus valmis näidet, millest alustada.

  • Kahesuunaline teisendusVookaardid, mille kleebid sisse, parsitakse tagasi lõuendile — sõlmed, kujud, värvid, alamgraafikud ja kõik muu.

  • Iga diagrammitüüpVookaart, jada, klass, olek, ER, gantt, git graaf, sektordiagramm — eelvaade renderdab kõike, mida mermaid toetab.

Suured diagrammid püsivad loetavad

Arhitektuuridiagrammid kasvavad kiiresti ühest ekraanist suuremaks. Panoraamimine, suumimine ja rühmitamine on selleks loodud, mitte selle vastu võitlemiseks.

  • Alad ja pesastamineRühmita plokid alamgraafikuteks, pesasta ala teise sisse, liiguta terve alampuu ühe liigutusega.

  • Suum 2%-st 1600%-niKeri, et panoraamida, ctrl+keri, et suumida, või tsentreeri uuesti ühe nupuga.

  • Salvestub jooksvaltDiagramm salvestub redigeerimise ajal automaatselt brauserisse. Kui logid sisse, salvestub see sinu kontole ja järgib sind igasse seadmesse.

Ekspordi ja tegele oma asjadega

Miski pole lukustatud. Võta pilt, võta lähtekood või võta Markdown-plokk, mis on valmis dokumenti kleepimiseks.

  • Ilma tasulise piirangutaIga funktsioon, sealhulgas eksport, on tasuta. Ülemineku jaoks pole tasulist taset.

  • Renderdatakse teie brauserisRenderdamine toimub sinu brauseris; ilma kontota ei lahku diagramm sellest kunagi ja kontoga järgib salvestatud dokument sind igasse seadmesse.

  • SVG, PNG, .mmd, .mdKopeeri SVG-märgistus, laadi alla 2x PNG, salvesta mermaid lähtekood või võta valmis Markdown-plokk.

Kuidas see võrdub tavaliste valikutega

Diagram-as-code tööriistad panevad kõike käsitsi kirjutama. Lohista-ja-aseta tööriistad annavad pildi, mida ei saa võrrelda (diff). See tööriist ei vali kumbagi poolt.

Alustamine

IQ Mermaid: Topeltklõpsa lõuendil ja sõlm ilmub. Süntaksit saad õppida hiljem — või mitte kunagi.

Tüüpiline tööriist: Loe kõigepealt süntaksijuhendit või leppi joonistustööriistaga, millel pole üldse tekstiesitust.

Väljundformaat

IQ Mermaid: Tavaline mermaid — sama tekst, mida GitHub, GitLab ja Notion loomupäraselt renderdavad.

Tüüpiline tööriist: Omanduslik fail, mis avaneb ainult tööriistas, mis selle lõi.

Hilisem muutmine

IQ Mermaid: Muuda koodi või liiguta plokke. Mõlemad suunad töötavad sama diagrammiga.

Tüüpiline tööriist: Ainult üks suund: koodipõhistel tööriistadel pole lõuendit, lõuendipõhistel pole lähtekoodi.

Hind

IQ Mermaid: Tasuta — isegi e-posti pole vaja.

Tüüpiline tööriist: Tasuta tase piiratud paari diagrammiga, eksport või koostöö tellimuse taga.

Kus andmed asuvad

IQ Mermaid: Sinu brauseris või kontol, kui soovid, et see järgiks sind igasse seadmesse.

Tüüpiline tööriist: Konto kellegi serveris, mille külge on sinu diagrammid kinnitatud.

Mermaid redaktori küsimused

Alustamiseks piisab lehe avamisest.

Mis on mermaid?

Mermaid on diagrammide tekstisüntaks: kirjeldad sõlmi ja nooli mõne reaga ning renderdaja joonistab pildi. GitHub, GitLab, Notion ja Obsidian renderdavad seda Markdowni sees, nii et mermaid plokk jääb loetavaks pull request'is või wiki-lehel.

Kas see mermaid redaktor on tõesti tasuta?

Jah. Kõik funktsioonid, sealhulgas eksport SVG- ja PNG-vormingusse, on tasuta ja saad redaktorit kasutada ilma midagi loomata. Valikuline tasuta konto lisab rohkem salvestatud diagramme ja seadmetevahelise sünkroonimise — tasulist plaani pole ja midagi ei hoita tagasi.

Kas pean mermaid süntaksit oskama?

Ei. Alusta visuaalsest sakist: topeltklõpsa lõuendil, et lisada plokk, vali see ja tõmba nool teise juurde. Mermaid kood genereeritakse sinu eest ja saad seda igal ajal lugeda, et süntaksit õppida.

Milliseid diagrammitüüpe toetatakse?

Koodisakk renderdab kõike, mida mermaid toetab — vookaart, jada, klass, olek, olemi-seose diagramm, gantt, git graaf, sektordiagramm ja rohkem. Visuaalne lõuend muudab spetsiifiliselt vookaarte, mis on enamiku diagrammide puhul just see, mida vaja.

Kas saan eksportida PNG- või SVG-formaati?

Jah. Kopeeri SVG-märgistus lõikelauale, laadi alla SVG-fail või laadi alla PNG, mis on renderdatud 2x suuruses slaidide ja dokumentide jaoks. Samuti saad salvestada mermaid lähtekoodi .mmd-failina või valmis Markdown-plokina.

Kus mu diagramm hoiul on?

Ilma kontota salvestub sinu ainus diagramm brauserisse, nii et see on seal, kui samasse seadmesse tagasi tuled. Kui logid sisse, salvestub see sinu kontole ja võib järgneda sulle teise seadmesse. Ekspordi lähtetekst, kui soovid enda koopiat.

Kas saan olemasoleva mermaid diagrammi sisse kleepida?

Jah. Kleebi see koodisakile; vookaart parsitakse tagasi visuaalsele lõuendile koos sõlmede, kujude, värvide ja alamgraafikutega. Teised diagrammitüübid renderduvad eelvaates, kuid jäävad ainult koodikujul.

Kas see töötab võrguühenduseta?

Renderdamine toimub täielikult brauseris, nii et pärast lehe laadimist töötab redaktor ka ilma ühenduseta.

Ava redaktor. Tasuta — ilma registreerimiseta.

Tühi lõuend, koodisakk ja kõik ekspordivõimalused — tasuta, sinu brauseris, kohe praegu.