AI-tegning

Denne siden er en referanse for hvordan en AI-klient (ChatGPT, Claude, Gemini, Cursor, …) tegner profesjonelle diagrammer i LetDraw over API og MCP. Modellen trenger ikke å gjette letdraws skjema: alt nedenfor presenteres også for modellen på anropstidspunktet, slik at en tilkoblet modell kan lese det og tegne riktig på første forsøk.

Hvordan modellen lærer LetDraw

Du trener ikke modellen på nytt; du gir den kontekst på anropstidspunktet. LetDraw eksponerer all tegnekunnskapen sin gjennom MCP-serveren og REST API:

Hva	MCP	REST
Hvordan tegne (denne guiden, maskinlesbar)	resource letdraw://capabilities	GET /capabilities
Hvert ikonbibliotek + alle elementetiketter	resource letdraw://libraries	GET /libraries?items=1
Bibliotek-id-er + antall	tool list_shape_libraries	GET /libraries
Finn et ikon for en komponent	tool search_icons	GET /icons?query=…
Opprett / oppdater et diagram	tools create_diagram / update_diagram	POST / PATCH /documents

En veloppdragen klient leser ressursene letdraw://capabilities og letdraw://libraries én gang, og tegner deretter. Pek AI-en din mot MCP- endepunktet (se API og MCP); den oppdager resten på egen hånd.

Gylne regler for profesjonelt resultat

1. Bruk ekte ikoner, ikke tegn dem. Kall search_icons (f.eks. "postgres", "redis", "kubernetes pod", "load balancer") og legg den returnerte ref- verdien inn i boksens iconRef-felt (f.eks. "databases/PostgreSQL"). Serveren stempler nøyaktig det ikonet og flyter etiketten under det.
2. Hold beholdere rene. Store grupperingsbokser (en Kubernetes Cluster, en VPC, et subnettbånd) bør være brede (> 420px) eller en frame. Ikoner stemples bare på nodestørrelse-bokser (60-420px brede, 40-260px høye). Plasser en beholders tittel som frittstående tekst over den, ikke som en bundet etikett.
3. Nest bevisst. Ytre farget beholder til nodestørrelse-bokser inne, hver med sitt eget ikon. To eller tre nivåer leses best (Cluster til Worker Node til Pod).
4. Rut piler rent. For rettvinkel- / flerbøy-koblinger, send en pil med 3+ points; bind endene til figurer slik at de forblir festet.
5. Fargekod etter rolle og hold avstanden konsistent.

Sende en scene

create_diagram / update_diagram godtar elements som enten letdraw-native elementer eller standard Excalidraw JSON (auto-detektert og konvertert på serveren). Å produsere Excalidraw JSON er den enkleste høykvalitets- veien; native LetDraw gir deg de letdraw-spesifikke funksjonene nedenfor.

Vanlige elementfelter

id, type, x, y, width, height pluss stil: strokeColor (hex), fillColor (hex eller "transparent"), fillStyle (hachure | cross-hatch | solid | dots | zigzag | dashed | zigzag-line), strokeWidth (1-8), strokeStyle (solid | dashed | dotted), roughness (clean | sketch | scribble), bowing (straight | curved | wavy), corner (sharp | rounded | beveled), opacity (0-100), seed. Valgfritt: text, fontSize, fontFamily (hand | normal | code), textAlign, groupIds, angle (radianer), link, shadow (none | soft | hard), og letdraw-utvidelsen iconRef.

Figurtyper

rectangle, ellipse, diamond, triangle, right-triangle, parallelogram, trapezoid, star, hexagon, heptagon, octagon, cross, cloud, cylinder, speech-bubble, document, manual-input, display, terminator, data-storage, preparation, blokk- piler (arrow-right/left/up/down), pluss text, image (dataURL), frame (merket stiplet seksjon; sett name), embed (url), math (LaTeX i text), code (kildekode i text, language). En figur bærer etiketten sin med text inne (i Excalidraw-format, via et tekstelement med containerId).

Piler

type: "arrow" og:

• arrowShape: straight | curved | elbow | s-curve | smart | multipoint | multipoint-curved. smart ruter automatisk rundt andre figurer. multipoint er en skarp flersegmentert polylinje; multipoint-curved er den utjevnede versjonen; begge leser hjørnene sine fra points.
• points: {x, y}[] i absolutte verdenskoordinater (første til siste). 2 punkter = rett, 3 = albue (enkelt bøy), 4+ = rutet polylinje. Rettvinkel- kobling: points: [{x1,y1},{x2,y1},{x2,y2}].
• controlPoint / controlPoint2: bezier-håndtak for curved / s-curve / elbow.
• startArrowhead / endArrowhead: none | arrow | triangle | triangle-outline | circle | diamond | diamond-outline | bar | crows-foot | crows-foot-bar | double-bar | circle-bar | circle-crows-foot. Bruk UML-hoder (triangle-outline = generalisering, diamond = komposisjon) og ER-crow’s-foot- hoder for kardinalitet.
• startBinding / endBinding: {elementId, focus:{x,y}}: bind en ende til en figur (focus er et 0..1-punkt i figurens bbox) slik at pilen følger den.

I Excalidraw-format, send pilen med points + startArrowhead/endArrowhead; konverteren tilordner 2 / 3 / 4+ punkter til straight / elbow / s-curve og beregner bindingene på nytt.

Linjer

type: "line" og lineShape: straight | multipoint | multipoint-curved. Flerpunktslinjer bærer points (samme som piler, uten et pilhode). Også freedraw (points[]) og highlight (halvgjennomsiktig merkepenn).

Ikoner: iconRef-flyten

1. search_icons({ query }) produserer en rangert [{ library, label, ref }].
2. Sett iconRef: "<library>/<Item Label>" (eller { library, label }) på målboksen.
3. create_diagram stempler det ikonet øverst i midten og flytter etiketten under det.

En eksplisitt iconRef vinner alltid; deretter får enhver gjenværende merket node uten et ikon automatisk et beste-gjetning-nøkkelordikon. I en sky-scene, spesifiser leverandøren (kubernetes / aws / azure / gcp) slik at leverandørens ikonsett foretrekkes. Bla i id-er med list_shape_libraries; hele etikettkatalogen er i letdraw://libraries (eller GET /libraries?items=1).

Databaseprodukter løses til Databases-biblioteket: ekte logoer der merke- policyen tillater det (PostgreSQL, MariaDB, Cassandra, DynamoDB, …), ellers DB-passende generiske ikoner (MySQL, Redis, MongoDB, …).

Lite Excalidraw-format-eksempel

[
  { "id": "db", "type": "rectangle", "x": 0, "y": 0, "width": 200, "height": 90,
    "backgroundColor": "#eef2ff", "strokeColor": "#334155", "roundness": { "type": 3 },
    "iconRef": "databases/PostgreSQL", "boundElements": [{ "type": "text", "id": "dbt" }] },
  { "id": "dbt", "type": "text", "x": 10, "y": 30, "text": "Orders DB", "containerId": "db" },
  { "id": "a1", "type": "arrow", "x": 200, "y": 45, "points": [[0, 0], [80, 0], [80, 120]],
    "endArrowhead": "triangle", "startBinding": { "elementId": "db" } }
]

Merknad

Excalidraw er et varemerke tilhørende Excalidraw-teamet; LetDraw tilbyr bare filformat- kompatibilitet og har ingen tilknytning til Excalidraw.

Andre verktøy

• diagram_from_code: send docker-compose / Kubernetes-manifest / Graphviz DOT / PlantUML / Terraform / Helm values / SQL DDL; LetDraw auto-detekterer formatet og legger det ut.
• export_to_code: et diagram til Mermaid eller D2.
• generate_from_prompt: naturlig språk til diagram, ved hjelp av kontoen din egen AI-nøkkel.

For autentisering, endepunkter, scopes og klientoppsett, se API og MCP.