Skip to main content
Skip table of contents

3.3.8.4. Flussdiagramm

Ein Flussdiagramm oder Ablaufdiagramm (engl. Flowchart) ist ein Diagramm, das einen Prozess, ein System oder einen Algorithmus beschreibt und darstellt.

Diese Art von Diagramm wird in verschiedenen Bereichen eingesetzt, um komplexe Prozesse zu dokumentieren, planen, optimieren und zu kommunizieren.


3.3.8.4.1. Tab “Flussdiagramm” hinzufügen

Tabs können auf den Ebenen “Werk“, “Fabrik“ und “Produktlinie” in der Menüleiste über das Icon image-20240809-115013.png “Tab hinzufügen” neu erstellt werden.

image-20241002-114940.png

Tab hinzufügen - Tab-Typ “Flussdiagramm”

ID

  • Dies ist das Eingabefeld für die Tab-ID für den neuen Tab. Die ID muss in dieser Ebene (z.B. Produktlinie) eindeutig sein.

Die ID eines Tabs kann nur über “Tab verschieben” geändert werden.

Typ

  • In einem Drop-down-Menü kann aus einer Auswahl von Tab-Typen der Typ ausgewählt werden.

Orderindex

  • Der Orderindex legt fest, in welcher Reihenfolge die Tabs in der Tab-Leiste angezeigt werden.

  • Der Tab mit dem niedrigsten Orderindex steht in der Menüleiste ganz links und wird beim Öffnen der Ebene zuerst angezeigt. Das gilt nicht, wenn dieser Tab ausgeblendet ist.

Sichtbarkeit

  • In einem Drop-down-Menü kann die Sichtbarkeit des Tabs in der Menüleiste ausgewählt werden:

    • Sichtbarkeit “0” = wird ausgeblendet

    • Sichtbarkeit “1” = wird angezeigt

  • Ausgeblendete Tabs können über das Kontextmenü der Tabs wieder eingeblendet werden.

Name

  • Dieser Name wird in der Menüleiste für Tabs angezeigt und sollte möglichst gut beschreiben, was der Tab beinhaltet.

Kommentar

  • Hiermit kann der Tab genauer beschrieben werden.

  • Der Kommentar erscheint als Tooltip, wenn man mit der Maus über dem Tab-Namen in der Menüleiste schwebt.

Datenquelle

  • In einem Drop-down-Menü kann eine Datenquelle ausgewählt oder manuell eingegeben werden.

  • Über den aktivierten Toggle-Button image-20240812-121755.png können alle verfügbaren Datenquellen angezeigt werden.

Text

  • Dieser Text kann als einleitende Beschreibung verwendet werden.

  • Er steht im Anzeigefeld ganz oben, direkt unter der Menüleiste für die Tabs.

Button “Anwenden”

  • Mit Auswahl dieses Buttons wird der neue Tab erstellt und in der Menüzeile der Tabs angezeigt.


3.3.8.4.2. Menüleiste für Tab “Flussdiagramm”

Die Optionen der Menüleiste beziehen sich auf den Tab als Gesamtheit.

image-20241002-115213.png

Icon image-20241002-085701.png “Feldliste anzeigen”

  • Für diesen Tab-Typ nicht aktiviert.

Icon image-20241002-085750.png “Optionen”

  • Für diesen Tab-Typ nicht aktiviert.

Icon image-20241002-085810.png “Speichern”

  • Über dieses Icon werden direkt alle Änderungen des Tabs gespeichert. Dafür muss der Design-Modus aktiviert sein.

Icon image-20241002-085840.png “Neu laden”

  • Temporäre und nicht gespeicherte Änderungen können so verworfen werden.

Icon image-20241002-085855.png “Importieren”

  • Ein Tab kann mit all seinen Inhalten inklusive Layout importiert werden.

  • Es öffnet sich ein Dialog, in welchem die zu importierende Datei mit der Dateierweiterung “.sql” über den Button “Datei öffnen” von einem Speicherort ausgewählt bzw. importiert werden kann.

  • Nachdem eine Datei ausgewählt wurde, werden die zugehörigen Daten automatisch im Dialog eingetragen und nur der Zielort, wo der Tab eingefügt werden soll, muss ausgewählt werden.

Icon image-20241002-085934.png “Exportieren”

  • Ein Tab kann mit all seinen Inhalten und Layout exportiert werden. Es besteht dazu eine Möglichkeit: “Tab exportieren”. Die Optionen “Nach Excel exportieren” und “Nach PDF exportieren” sind nicht aktiviert.

  • Bei Auswahl von “Tab exportieren” öffnet sich ein Dialog, in welchem der Dateiname “tab_<Tab-ID>” vorausgefüllt ist. Dieser Name kann manuell angepasst werden.

Die Optionen “Nach Excel exportieren” und “Nach PDF exportieren” sind je nach Tab (de-)aktiviert.

Icon image-20240809-115013.png “Tab hinzufügen”

  • Tabs können auf den Ebenen “Werk”, “Fabrik” und “Produktlinie” neu hinzugefügt werden.

  • Bei Auswahl dieses Icons öffnet sich ein neuer Dialog, welcher im jeweiligen Unterpunkt zum Tab-Typ ausführlich beschrieben wird.


3.3.8.4.3. Beispiel Tab-Typ “Flussdiagramm”

Für diesen Tab wird das “DevExtreme Diagram” des Herstellers DevExpress verwendet. Weitere Informationen dazu hier: https://js.devexpress.com/Angular/Demos/WidgetsGallery/Demo/Diagram/Overview/MaterialBlueLight/

image-20241007-090542.png

Beispiel aus dem Demo-Modul “Investitionsplanung” - Technische Dokumentation


3.3.8.4.3.1. Designmodus aktivieren

  • Um die Bearbeitung des Arbeitsblatts zu aktivieren, muss der Designmodus aktiviert werden.

image-20241002-121740.png

Oben: Ansicht ohne aktivierten Designmodus - Unten: Ansicht mit aktiviertem Designmodus


3.3.8.4.3.2. Designmodus - Toolbox (A)

Hier können verschiedene für ein Flussdiagramm typische Elemente wie Formelemente oder Container aktiviert und verändert werden.

  • Über ein Suchfeld kann gezielt nach bestimmten Elementen gesucht werden.

  • Es stehen vier Bereiche zur Verfügung, welche jeweils aus- und eingeklappt werden können:

    • Allgemein: allgemeine geometrische Formen und Pfeile

    • Flussdiagramm: für Flussdiagramme gängige Formen wie z.B. für Datenbanken, Prozesse, usw.

    • Organisation: Karten, mit einem an verschiedenen Stellen positioniertem Bild

    • Container: horizontale und vertikale Container

  • Die Diagrammelemente können mit Drag & Drop auf das Arbeitsblatt gezogen werden.

  • Jede Aktivität kann über die Icons image-20241002-125707.png image-20241002-125811.png rückgängig gemacht oder wiederhergestellt werden.

  • Die Anzeige der Diagrammelemente (das Fenster) kann mit Drag & Drop verschoben werden, indem man mit einem Linksklick auf das Zeichen image-20241002-122136.png im oberen Rahmen der Anzeige Drag und Drop aktiviert (Cursor wird zu image-20241007-081612.png).


3.3.8.4.3.3. Designmodus - Arbeitsblatt (B)

Das Arbeitsblatt ist die Seite, auf welcher das Flussdiagramm erstellt werden kann.

  • Wurde ein Element auf das Arbeitsblatt gezogen, kann dieses bearbeitet werden, indem man die Bearbeitung mit einem Linksklick auf das Element aktiviert.

  • Die Bearbeitungsmöglichkeiten des Elements werden farblich hervorgehoben:

image-20241007-081200.png
  • Über die gelben Quadrate kann die Größe des Elements verändert werden. Bei Verbindungspfeilen kann über die gelben ausgefüllten Quadrate die Verbindung verschoben werden.

  • Über die grünen Punkte können direkt Pfeile gezogen werden und es öffnet sich am Ende des Pfeils ein Feld mit den jeweiligen Elementen des Bereichs (allgemein, Flussdiagramm, usw.), die gerade in Benutzung sind.

  • Über das rote Quadrat kann die Form des Elements verändert werden.

  • Mit einem Drag & Drop (Cursor wird zu image-20241007-081555.png) kann das Element beliebig auf dem Arbeitsblatt verschoben werden

  • Zieht man ein Element nach links, nach rechts, nach oben oder nach unten über den Rand des Arbeitsblatts hinaus, wird das Arbeitsblatt automatisch vergrößert bzw. eine weitere Seite hinzugefügt. Wird das Element gelöscht, verkleinert sich die Seite wieder.

  • Über die Icons image-20241002-125707.png “Rückgängig” und image-20241002-125811.png “Wiederherstellen” können Änderungen des Arbeitsblatts bearbeitet werden.

  • Mit einem gehaltenen Linksklick auf das Arbeitsblatt können verschiedene Bereiche markiert bzw. ausgewählt werden.

  • Mit einem Rechtsklick auf das Arbeitsblatt öffnet sich die Option “Alles auswählen” - gesperrte Elemente werden damit jedoch nicht ausgewählt.

  • Mit einem Rechtsklick auf ein Element öffnet sich ein Menü mit den Optionen “Ausschneiden, Kopieren, Löschen, Alles auswählen, In den Hintergrund/In den Vordergrund, Sperren/Entsperren”.


3.3.8.4.3.4. Designmodus - Ansichtsmenü (C)

Über diesen Bereich kann die Ansicht des Flussdiagramms bzw. des Arbeitsblatts eingestellt werden.

image-20241007-073148.png

Anzeige (100%)

  • Die Anzeige (Zoom) kann eingestellt werden, indem man rechts neben der Zoom-Anzeige auf den kleinen schwarzen Pfeil klickt, um ein Drop-down-Menü für die Zoom-Einstellungen zu öffnen.

  • Es kann die Größe z.B. von 50% bis 300% ausgewählt werden oder auch die Größe des Arbeitsblatts an den Inhalt oder Breite angepasst werden. Es kann auch eine automatische Anpassung an Inhalt oder Breite ausgewählt werden.

  • Eine manuelle Eingabe ist nicht möglich.

Icon image-20241007-073316.png “Vollbild”

  • Der Tab wird im Vollbildmodus angezeigt, d.h. die Sidebar, der Header und die Menüleiste der Tabs werden ausgeblendet.

  • Um den Vollbildmodus zu verlassen, muss wieder auf das Icon geklickt werden.

Icon image-20241007-073524.png “Export”

  • Es bestehen drei Möglichkeiten, das Arbeitsblatt bzw. das Flussdiagramm zu exportieren: Export als SVG, Export als PNG und Export als JPEG.

Icon image-20241007-073854.png “Einstellungen”

  • Über die Einstellungen können die Einheiten (in, cm, px), die Rastereinstellungen und die Ansicht bearbeitet werden.

    • Einheiten: Auswahl aus Zoll “in”, Zentimeter “cm” oder Pixel “px”

    • Raster: Raster anzeigen, am Raster ausrichten, Rastergröße

    • Ansicht: Einfache Ansicht (komplette Anzeige des Arbeitsblatts) und Toolbox anzeigen (Fenster mit allen Diagrammelementen)


3.3.8.4.3.5. Designmodus - Eigenschaftsmenü für Stil, Layout und Diagramm (D)

Dieses Untermenü hat drei verschiedene Registerkarten und erlaubt Detaileinstellungen rund um das Diagramm und dessen Layout.

Registerkarte Stil

image-20241002-123243.png

Text

  • In diesem Bereich kann der Text angepasst werden, in dem die Schriftart, Schriftgröße, Textpositionierung, Textfarbe usw. eingestellt werden.

Objekt

  • Alle Einstellungen beziehen sich auf das ausgewählte Element. Ist aktuell kein Element ausgewählt, gelten die Einstellungen für ein neu erstelltes Element.

  • Einstellbare Eigenschaften für ein Element sind: Linienart, Linienstärke, Linienfarbe und Füllfarbe.

Verbindung

  • Diese Einstellungen beziehen sich auf die Verbindungspfeile zwischen zwei Elementen.

    • Konnektor Linienart: Ermöglicht die Auswahl der Verbindungsart zweier Elemente. Es besteht die Möglichkeit für eine direkte Verbindung mittels einer einzigen Linie oder eine rechtwinklige Stufung.

    • Konnektor Linienanfang: Ermöglicht die Auswahl der Pfeilform am Anfang der Verbindung. Es ist kann auch die Option “keine Pfeilform” ausgewählt werden (durchgestrichenes Quadrat).

    • Konnektor Linienende: Ermöglicht die Auswahl der Pfeilform am Ende der Verbindung. Es ist kann auch die Option “keine Pfeilform” ausgewählt werden (durchgestrichenes Quadrat).


Registerkarte Layout

image-20241002-123432.png
  • Ermöglicht die automatische Anordnung der verbundenen Elemente in Ebenen (“mehrschichtig”) oder Bäumen (“Baum”).

  • Beide Typen können verschieden orientiert und direktional angeordnet werden.


Registerkarte Diagramm

image-20241002-123404.png
  • Über diese Registerkarte kann die Arbeitsblattgröße, die Seitenorientierung (Hochformat oder Querformat) und die Hintergrundfarbe des Arbeitsblatts eingestellt werden.


3.3.8.4.4. Kontextmenü des Tabs

JavaScript errors detected

Please note, these errors can depend on your browser setup.

If this problem persists, please contact our support.