Diagrammen

D2 Renderer

Snel starten met
Diagram

Het diagram wordt in je browser getekend. Je code wordt niet opgeslagen, tenzij je zelf op "Deel met preview" klikt.

D2 levert de mooiste automatische layout van alle diagramtalen, maar je hebt er een renderer voor nodig. Plak je code hiernaast en zie meteen wat er staat.

Waar je dit voor gebruikt

  • a -> b: label — verbinding met tekst
  • server: {shape: cylinder} — vorm kiezen
  • groep: { a; b } — onderdelen groeperen
  • a -> b: {style.stroke: "#2563eb"} — kleur geven
  • a <-> b — verbinding in twee richtingen
  • x.y.z — geneste onderdelen benoemen

Wat anderen van deze tool vinden

Nog geen beoordelingen voor deze tool. Die van jou is de eerste.

Veelgestelde vragen

Wat is D2?

Een diagramtaal uit 2022 met een prettige syntax en een sterke automatische layout — vooral bij architectuurplaten met veel onderdelen ziet het resultaat er beter uit dan bij oudere talen.

Wordt mijn code opgeslagen?

Nee. Je D2 wordt op onze server omgezet in een tekening en verdwijnt daarna direct; we bewaren hem niet en loggen de inhoud niet. Alleen als je zelf op 'Deel met preview' klikt slaan we de code op om een deelbare link te kunnen maken.

Waarom werken imports met @ niet?

Een import laat D2 een ander bestand inlezen. In een webtool zou dat naar bestanden op onze server kunnen wijzen, dus we staan het niet toe. Deze tool rendert één losse diagram-definitie.

Waarom zie ik mijn markdown-label niet?

Blokken met |md ... | mogen willekeurige HTML bevatten. Die verwijderen we uit de tekening, omdat opgemaakte tekst van een onbekende bezoeker in een webpagina een bekend beveiligingsrisico is. Gewone labels worden gewoon getoond.

Waarom duurt een groot diagram lang of stopt het?

We kappen een render af na zes seconden. Een normaal diagram is in een fractie daarvan klaar; loop je ertegenaan, dan is het schema meestal te groot voor één plaat en kun je het beter opsplitsen.