Schablonen
Das Design von IBM® ILOG® Dojo
Diagrammer kann in zwei Hauptszenarien unterteilt werden:
Im Ersten Szenario wird das Diagram-Widget verwendet, um den Inhalt eines Datenspeichers als Diagramm anzuzeigen.
Im zweiten Szenario wird ein
Selection
gewöhnlich aus GFX-Formen
zusammengesetzt, die auf Benutzerschnittstellenebene erstellt werden und nicht an den Datenspeicher gebunden sind.
Diese Unterteilung hat Auswirkungen auf die Funktionen zum Kopieren und Einfügen.
Wenn Sie im ersten Szenario Inhalt kopieren und in einen Datenspeicher einfügen, findet die Duplizierung im Datenspeicher
statt, und in der Grafik spiegelt sich die Änderung durch Abhängigkeitsaktualisierungen wider.
Im zweiten Szenario findet die Duplizierung auf GFX-Ebene statt. Ein Benutzer möchte möglicherweise auch, dass Benutzerdaten
gespeichert und in den Kopier- und Einfügeoperationen angewendet werden, einschließlich Benutzerdaten, die momentan nicht sichtbar sind.
Diese Operationen erzeugen je nach verwendetem Szenario unterschiedliche Ergebnisse.
Zur Berücksichtigung dieser Variabilität stellt
IBM® ILOG® Dojo Diagrammer eine Bibliothek mit Schablonenoperationen bereit, die Ihnen die Implementierung von Anpassungen
ermöglichen.
Darstellung
Die Darstellung kopierter Elemente muss vom Kontext unabhängig sein.
So muss die Darstellung beispielsweise auch dann vorhanden sein, wenn keine GFX-Oberfläche aktiv ist (z. B., wenn es
keine
DataStore
-Verbindung gibt). Die Darstellung gleicht
dem Serialisierungsalgorithmus in dojox.gfx
, der diese Eigenschaft hat (Unabhängigkeit von Plattform/Renderer). Bei der Serialisierung
werden GFX-Objekte in eine JSON-kompatible JavaScript-Objektdarstellung konvertiert, unabhängig vom Renderer und von der Existenz der Oberfläche.
Dasselbe Konzept wird für die Darstellung kopierter Formen angewendet.
Serialisierung und Deserialisierung
Die Klasse Serializer bearbeitet
Entwurfslogik für die Serialisierung und insbesondere für Kopier- und Einfügeoperationen.
Kopieroperationen werden in die Zwischenablage serialisiert, und Einfügeoperationen werden
aus der Zwischenablage deserialisiert.
Die Klasse
ibm_ilog.diagram.util.Serializer
besitzt
eine Reihe von Benutzercallbacks, die die feineren Details der Daten bearbeiten, die kopiert werden.
Zu den Callbacks gehört eine Funktion zum Abrufen der IDs, die kopierten Entitäten zugeordnet sind, und
eine Serialisierungsfunktion für jede Entität in einem Graphen.
Die Serialisierungscallbacks generieren und geben die Darstellung der zugeordneten Entität zurück.
Die Daten werden vom zugeordneten Benutzercallback für die Deserialisierung verwendet. Deshalb müssen alle Daten, die für die Wiederherstellung
erforderlich sind, in den entsprechenden Kontext gestellt werden.
Die Deserialisierungscallbacks erstellen neue Entitäten, die auf ihrer vorhandenen Darstellung basieren.
Diese Callbacks empfangen die von den Benutzercallbacks serialisierten Daten, einschließlich eines
nach ID sortierten Dictionarys aller neuen Entitäten, die bereits im Deserialisierungsprozess erstellt wurden,
und des Containers, in dem die neue Entität vom aktuellen Callback erstellt wird.
Ein Deserialisierungscallback muss außerdem ein Objekt zurückgeben, das die durch die Deserialisierung neu erstellte Entität darstellt.
Dieser Wert wird im Dictionary für weitere Callbackaufrufe im Prozess gespeichert und als Containerargument in Aufrufen an die
untergeordneten Elemente der Entität (im Fall von Untergraphen) übergeben.
Die folgenden Callbacks werden im Serialisierungs- und Deserialisierungsprozess verwendet:
getId
identifiziert durch den Serialisierungs-/Deserialisierungsprozess serialisierte Graphenelemente.serializeNodeData
wird für die Serialisierung eines Knotens verwendet. Verwenden Sie diese Callbackfunktion, um die entsprechende Darstellung für einen Knoten zu erstellen, die später von der entsprechenden Deserialisierungsfunktion verwendet wird.serializeLinkData
wird für die Serialisierung eines Links verwendet. Verwenden Sie diese Callbackfunktion, um die entsprechende Darstellung für einen Link zu erstellen, die später von der entsprechenden Deserialisierungsfunktion verwendet wird.serializeSubgraphData
wird für die Serialisierung eines Untergraphen verwendet. Verwenden Sie diese Callbackfunktion, um die entsprechende Darstellung für einen Untergraphen zu erstellen, die später von der entsprechenden Deserialisierungsfunktion verwendet wird.deserializeNodeData
deserialisiert einen Knoten aus den serialisierten Daten im angegebenen Container.deserializeLinkData
deserialisiert einen Link aus den serialisierten Daten im angegebenen Container.deserializeSubgraphData
deserialisiert einen Untergraphen aus den serialisierten Daten im angegebenen Container.
Für Kopier- und Einfügeanpassungen rufen Sie die Funktion
serialize(entity)
und anschließend die Funktion
deserialize(representation,container)
auf.
Das Argument entity
ist das Objekt, das serialisiert wird.
Das Argument representation
ist das Ergebnis, das beim vorherigen
Aufruf von serialize
erhalten wurde, und container
ist das Objekt, das
mit den benutzerdefinierten Objekten kompatibel ist, das im Callback deserializeSubgraph
zurückgegeben wurde.
Die Funktion deserialize
erfasst die Ergebnisse der Benutzercallbacks und gibt sie in einer Datenstruktur zurück.
Beispiel
Das folgende Beispiel veranschaulicht, wie eine datenspeicherbasierte Basisserialisierungsmethode für Graphen
geschrieben wird:
var serializer = new ibm_ilog.diagram.util.Serializer({ getId: function(ge) { return ge.getId(); }, serializeNodeData: function(ge){ return { transform:m.clone(ge.getTransform()) }; }, deserializeNodeData: function(s,newByOldId,container){ var node = container.graph.createNode(); node.setTransform(s.transform); return {created:node}; }, serializeSubgraphData: function(ge){ return { transform:m.clone(ge.getTransform()) }; }, deserializeSubgraphData: function(s,newByOldId,container){ var sg = container.graph.createSubgraph(); sg.setTransform(s.transform); return {created:sg,graph:sg.getGraph()}; }, serializeLinkData: function(ge){ return { startId:ge.getStartNode().getId(), endId:ge.getEndNode().getId() }; }, deserializeLinkData: function(s,newByOldId,container){ var link = container.graph.createLink(); link.setStartNode(newByOldId.item(s.startId).created); link.setEndNode(newByOldId.item(s.endId).created); return {created:link}; } });