Modeling Guide for SAP Data Hub

Creating Scenes for Graphs (Beta)

SAP Data Hub Modeler provides graphical capabilities that help users to create user interfaces for graphs.

Creating Scenes for graphs help visualize data flow. The Modeler provides a canvas, referred to as a Scene Editor, to design and create user interfaces for graphs. This section describes how you can work with the Scene Editor to create visualizations.

Scenes

Scenes are 2D or 3D visualizations you create for a graph using the Scene Editor.

A 2D scene is the equivalent of a pre-configured HTML page where you add HTML elements.

A 3D Scene is the equivalent of the canvas where the 3D elements are modeled. When you add a 3D element to the scene, the application creates a 3D environment (a tile) for the element in the canvas. Within this environment, you can add only 3D elements.

Scene Editor

The Scene Editor is a canvas within the Modeler where you design and create Scenes.

Controls

SAP Data Hub Modeler provides built-in elements within the Scene Editor that you can drag-and-drop to the canvas to create a Scene for the graph. These elements are referred to as Controls.

A Control can be anything from a simple <input> tag in an HTML context to a very complex 3D animated object with effects. In the Controls tab, you can access them to view, edit, or drag and drop them to the Scene Editor.

Scene Connector Operator

The Scene Connector operator in the Modeler helps establish a connection between the running graph and the scene. The controls in the scene know how to receive and send data to this operator.

See d016a8009e05462f8ea228cc6d9d15b1.html to learn more.

States

State is the consolidation of data by the Modeler when you execute a graph and it flows through the operators in it. It exists in two places: in the Scene Connector operator and in the Controls. The States help, for example, if the Scene is opened multiple times for a single graph. In such cases, the data that the State holds are shared between all open instances. If you modify the Scene, then the modifications are reflected in all other open interfaces.

Binding

You can add a Binding to link a Control property and the State. For the selected control, in its Configuration panel, click the icon to create a Binding. The Control receives the state changes through the binding and, if needed, can adapt the data to show the visualization that the user requires.

Viewer

The Modeler provides both an embedded viewer and a standalone viewer. The viewer allows you to preview your interface receiving and sending data in real time when designing the scene.

Embedded Viewer: In the scene editor toolbar, choose (Viewer) to open the running scene on top of the scene editor.

Standalone Viewer: In the scene editor toolbar, choose to open a new page with only your interface. You can use it to test the interface in different browsers or in VR headsets. You can also share the link to allow others to access your interface. You can also access the standalone viewer from the Status pane.