

Die vorliegende Übersetzung wurde maschinell erstellt. Im Falle eines Konflikts oder eines Widerspruchs zwischen dieser übersetzten Fassung und der englischen Fassung (einschließlich infolge von Verzögerungen bei der Übersetzung) ist die englische Fassung maßgeblich.

# Integration von Knowledge Graph-Szenen
<a name="tm-knowledge-graph-scene"></a>

Sie können AWS IoT App-Kit-Komponenten verwenden, um eine Webanwendung zu erstellen, die den Knowledge Graph in Ihre AWS IoT TwinMaker Szenen integriert. Auf diese Weise können Sie Diagramme erstellen, die auf den 3D-Knoten (den 3D-Modellen, die Ihre Ausrüstung oder Systeme repräsentieren) basieren, die in Ihrer Szene vorhanden sind. Um eine Anwendung zu erstellen, die 3D-Knoten aus Ihrer Szene grafisch darstellt, binden Sie die 3D-Knoten zunächst an Entitäten in Ihrem Workspace. Mit diesem Mapping werden die Beziehungen zwischen den in Ihrer Szene vorhandenen 3D-Modellen und den Entitäten in Ihrem Workspace AWS IoT TwinMaker grafisch dargestellt. Anschließend können Sie eine Webanwendung erstellen, 3D-Modelle mit Ihrer Szene auswählen und deren Beziehungen zu anderen Entitäten in einem Grafikformat untersuchen.

![\[Eine TwinMaker Szene mit einem Wissensdiagramm, das die Beziehungen zwischen 3D-Modellen zeigt.\]](http://docs.aws.amazon.com/de_de/iot-twinmaker/latest/guide/images/intro_kg_scene.png)


Ein Beispiel für eine funktionierende Webanwendung, die die AWS IoT App-Kit-Komponenten verwendet, um Diagramme in einer AWS IoT TwinMaker Szene zu generieren, finden Sie in der [AWS IoT TwinMaker Beispiel-React-App](https://github.com/awslabs/iot-app-kit/blob/3DKG_Demo/examples/react-app/src/components/index.tsx) auf Github.

## AWS IoT TwinMaker Voraussetzungen für Szenendiagramme
<a name="tm-knowledge-graph-prereqs"></a>

Bevor Sie eine Web-App erstellen, die AWS IoT TwinMaker Knowledge Graph in Ihren Szenen verwendet, müssen Sie die folgenden Voraussetzungen erfüllen:
+ Erstellen Sie einen AWS IoT TwinMaker Arbeitsbereich. Sie können einen Workspace in der [AWS IoT TwinMaker Konsole](https://console.aws.amazon.com/iottwinmaker/) erstellen.
+ Machen Sie sich mit dem AWS IoT TwinMaker Entity-Component-System und der Erstellung von Entitäten vertraut. Weitere Informationen finden Sie unter [Erstellen Sie Ihre erste Entität](twinmaker-gs-entity.md).
+ Erstellen Sie eine mit 3D-Modellen gefüllte AWS IoT TwinMaker Szene.
+ Machen Sie sich mit AWS IoT TwinMaker den Komponenten des AWS IoT App-Kits vertraut. Weitere Informationen zu den AWS IoT TwinMaker Komponenten finden Sie unter[Erstellen Sie eine benutzerdefinierte Webanwendung mithilfe von AWS IoT TwinMaker UI-Komponenten](tm-app-kit.md).
+ Machen Sie sich mit den Konzepten und Schlüsselbegriffen von Wissensgraphen vertraut. Siehe [AWS IoT TwinMaker Kernkonzepte des Wissensgraphen](tm-knowledge-graph.md#tm-knowledge-graph-concepts).

**Anmerkung**  
Um den AWS IoT TwinMaker Knowledge Graph und alle zugehörigen Funktionen nutzen zu können, müssen Sie entweder den **Standard** - oder den **gestaffelten** Paketpreis nutzen. Weitere Informationen zur AWS IoT TwinMaker Preisgestaltung finden Sie unter[AWS IoT TwinMaker Preismodus wechseln](tm-pricing-mode.md).

## Binden Sie 3D-Knoten in Ihrer Szene
<a name="tm-knowledge-graph-scene-data-binidng"></a>

Bevor Sie eine Web-App erstellen, die Knowledge Graph in Ihre Szene integriert, binden Sie die in Ihrer Szene vorhandenen 3D-Modelle, die als 3D-Knoten bezeichnet werden, an die zugehörige Workspace-Entität. Wenn Sie beispielsweise ein Modell einer Mixer-Ausrüstung in einer Szene haben und eine entsprechende Entität aufgerufen wird`mixer_0`, erstellen Sie eine **Datenbindung** zwischen dem Modell des Mixers und der Entität, die den Mixer darstellt, sodass das Modell und die Entität grafisch dargestellt werden können.

**Um eine Datenbindungsaktion durchzuführen**

1. Melden Sie sich bei der [AWS IoT TwinMaker -Konsole](https://console.aws.amazon.com/iottwinmaker/) an.

1. Öffnen Sie Ihren Workspace und wählen Sie eine Szene mit den 3D-Knoten aus, die Sie binden möchten.

1. Wählen Sie im Scene Composer einen Knoten (3D-Modell) aus. Wenn Sie einen Knoten auswählen, wird ein Inspektorfenster auf der rechten Seite des Bildschirms geöffnet.

1. Navigieren Sie im Inspektorfenster zum oberen Rand des Bedienfelds und wählen Sie die Schaltfläche **\$1** aus. Wählen Sie dann die Option **Entitätsbindung hinzufügen**. Dadurch wird ein Drop-down-Menü geöffnet, in dem Sie eine Entität auswählen können, die an Ihren aktuell ausgewählten Knoten gebunden werden soll.  
![\[Eine Szene, bei der das Pluszeichen im Inspektorfenster ausgewählt und Entitätsbindung hinzufügen markiert ist.\]](http://docs.aws.amazon.com/de_de/iot-twinmaker/latest/guide/images/binding-step-4.png)

1. Wählen Sie im Dropdownmenü Datenbindung die Entitäts-ID aus, die Sie dem 3D-Modell zuordnen möchten. Wählen Sie in den Feldern **Komponentenname** **und Eigenschaftsname** die Komponenten und Eigenschaften aus, die Sie binden möchten.  
![\[Eine Szene, bei der die Komponenten- und Eigenschaftsnamen im Inspektorfenster ausgewählt wurden.\]](http://docs.aws.amazon.com/de_de/iot-twinmaker/latest/guide/images/binding-step-6.png)

   Sobald Sie eine Auswahl für die Felder **Entitäts-ID**, **Komponentenname** und **Eigenschaftsname** getroffen haben, ist die Bindung abgeschlossen.

1. Wiederholen Sie diesen Vorgang für alle Modelle und Entitäten, die Sie grafisch darstellen möchten.
**Anmerkung**  
Derselbe Datenbindungsvorgang kann für Ihre Szenen-Tags ausgeführt werden. Wählen Sie einfach ein Tag anstelle einer Entität aus und folgen Sie demselben Verfahren, um das Tag an einen Knoten zu binden.

## Erstellen Sie eine Webanwendung
<a name="tm-knowledge-graph-scene-application"></a>

Nachdem Sie Ihre Entitäten gebunden haben, verwenden Sie die AWS IoT App-Kit-Bibliothek, um eine Web-App mit einem Knowledge-Graph-Widget zu erstellen, mit dem Sie Ihre Szene anzeigen und die Beziehungen zwischen Ihren Szenenknoten und Entitäten untersuchen können.

Verwenden Sie die folgenden Ressourcen, um Ihre eigene App zu erstellen:
+ Die [Github-Readme-Dokumentation zum AWS IoT TwinMaker Beispiel für die React-App](https://github.com/awslabs/iot-app-kit/blob/3DKG_Demo/examples/react-app/README.md).
+ Die AWS IoT TwinMaker [Beispielquelle](https://github.com/awslabs/iot-app-kit/blob/3DKG_Demo/examples/react-app/src/components/index.tsx) für die React-App auf Github.
+ Die Dokumentation „[Erste Schritte](https://awslabs.github.io/iot-app-kit/?path=/docs/overview-getting-started--docs)“ für das AWS IoT App-Kit.
+ Die Dokumentation zur [Video Player-Komponente](https://awslabs.github.io/iot-app-kit/?path=/docs/components-videoplayer--docs) für das AWS IoT App-Kit.
+ Die Dokumentation zur [Scene Viewer-Komponente des AWS IoT](https://awslabs.github.io/iot-app-kit/?path=/docs/components-sceneviewer--docs) App-Kits.

Das folgende Verfahren veranschaulicht die Funktionalität der Scene Viewer-Komponente in einer Web-App.

**Anmerkung**  
Dieses Verfahren basiert auf der Implementierung der AWS IoT App Kit Scene Viewer-Komponente in der AWS IoT TwinMaker React-Beispiel-App.

1. Öffnen Sie die Scene Viewer-Komponente der AWS IoT TwinMaker React-Beispiel-App. Geben Sie im Suchfeld einen Entitätsnamen oder einen Teil des Entitätsnamens ein (bei der Suche wird Groß- und Kleinschreibung beachtet) und wählen Sie dann die Schaltfläche **Suchen** aus. Wenn ein Modell an die Entitäts-ID gebunden ist, wird das Modell in der Szene hervorgehoben und ein Knoten der Entität wird im Scene Viewer-Fenster angezeigt.  
![\[Eine Szene, in der das Knowledge Graph-Szenen-Viewer-Fenster angezeigt wird.\]](http://docs.aws.amazon.com/de_de/iot-twinmaker/latest/guide/images/search_select_kg_event.png)

1. Um ein Diagramm aller Beziehungen zu erstellen, wählen Sie einen Knoten im Scene Viewer-Widget aus und klicken Sie auf die Schaltfläche „**Erkunden**“.  
![\[Eine Szene mit dem Knowledge Graph-Szenen-Viewer-Fenster, das ein Diagramm der Beziehungen anzeigt.\]](http://docs.aws.amazon.com/de_de/iot-twinmaker/latest/guide/images/explore_select_kg.png)

1. Drücken Sie die Taste **Löschen**, um Ihre aktuelle Grafikauswahl zu löschen und von vorne zu beginnen.