Diagramsystem

4 min read

Skapa flödesscheman, UML-diagram, nätverksdiagram och ansluta alla visuella element med smarta kontakter.

Diagram Flowchart

Översikt

Diagramsystemet ger:

  • Diagram Shapes - Flowchart, UML och nätverkssymboler
  • *Smart Connectors – Auto-routing pilar som uppdateras när former rör sig
  • Konnect Anything - Koppla alla dukar objekt (bilder, text, former, SVG)
  • Auto-Layout – ordna automatiskt diagram

Tillgång till Diagrampanelen

  1. Klicka på knappen Diagram i det vänstra verktygsfältet
  2. Diagrampanelen öppnar visar tillgängliga former

Diagrampanel

Skapa diagramformer

Från panelen

  1. Öppna Diagrampanelen
  2. Välj en formkategori (Flowchart, UML, Network, Basic)
  3. Klicka på en form för att lägga till den i duken
  4. Drag till position

Shape Kategorier

Kategori Shapes Använd för
Flowchart Process, beslut, terminal, data, dokument, databas Flowcharts, workflows
UML Klass, använd fall, skådespelare Programvarudiagram
Nätverk Cloud, Server Arkitekturdiagram
Grundläggande Rectangle, Circle, Triangle, Star Allmänt syfte

Ansluta objekt

Quick Connect (varje objekt)

  1. Välj källposten
  2. Håll Shift och klicka på målposten
  3. En kontakt skapas automatiskt

Använda Connect Mode

  1. Klicka Anslut* i Diagrampanelen (eller tryck på C)
  2. Klicka på källpostens port (blå cirkel)
  3. Dra till målpostens port
  4. Släpp för att skapa anslutningen

[Connect Anything] (…/images/diagram-connect-anything.png)

Fungerar med alla objekt

Anslutningar är inte begränsade till diagramformer. Anslut:

  • Bilder och importerade SVGs
  • Textelement
  • Anpassade former (cirklar, stjärnor, rektanglar)
  • Generatorskapade element

Connector Styles

Routing Styles

Stil Beskrivning Bäst för
Direkt direkt Straight linje Enkla anslutningar
Ortogonal Högervinkelvägar Tekniska diagram
Curved Smooth bezier kurvor Organiska layouter

Arrowhead Styles

Stil Utseende
Klassisk Fylld triangel
Stealth Diamant med notch
Sharp Långvarig punkt
Öppet V-shape skiss
Diamant Diamant form
Cirkel Fylld cirkel
Ingen Ingen arrowhead

Connector Styles

Auto-Layout

Ordna automatiskt ditt diagram:

  1. Välj former för att ordna (eller välj ingen för alla)
  2. Klicka Auto-Layout i Diagrampanelen
  3. Välj en layout algoritm

Layout Typer

Layout Beskrivning Bäst för
Hierarkisk Layered top-to-bottom Flowcharts, org diagram
Träd Föräldra-barn hierarki Familjeträd, filstrukturer
Radial Koncentriska cirklar Mind maps
Grid Regelbundet rutnät Inventarier, gallerier
Force-Directed Fysikbaserad Nätverksdiagram

Auto Layout

Diagram Exempel

Flowchart

Flowchart

En enkel process flödesschema med:

  • Terminalformer för Start/End
  • Processformer för åtgärder
  • Beslut diamant för villkor
  • Ortogonala kontakter

Nätverksdiagram

Network Diagram

En nätverksarkitektur som visar:

  • Cloud Form för Internet
  • Server former för infrastruktur
  • Dashed connectors för interna länkar

UML Använd Case

UML Diagram

Ett falldiagram för användning med:

  • Skådespelare Stick Siffra
  • Använd fall ellipser
  • Association connectors

Animerade kontakter

Lägg till “bolt” -effekten för animerat flöde:

  1. Välj en connector
  2. Aktivera Bolt Effect i Egenskaper
  3. Justera inställningar:
    • Color - Bult färg
    • Speed – Animationshastighet
    • Storlek - Bultstorlek

Bulten reser längs kontakten och visar dataflöde riktning.

Tips

Diagram Tips:

  • Använd ortogonal routing för tekniska diagram
  • Använd krökt routing för organiska, mind-map stilar
  • Applicera Auto-Layout efter att ha lagt till alla former
  • Håll Shift medan du drar för snap-to-grid

Keyboard Shortcuts

Nyckeln Action
C Enter connect mode
Escape Exit connect mode
Delete Ta bort vald kontakt/form

Relaterad