3D Scene

Overview

The 3D Scene component in Wyn Enterprise enables users to integrate interactive, data-driven 3D visualizations directly within a dashboard. This powerful tool supports a wide range of custom interactions—from simple scene display to advanced behaviors like triggering commands, linking dashboard elements, and running JavaScript logic.

You can visualize spatial data, simulate environments (such as factory floors or buildings), and drive engagement through animation, annotations, and dynamic interaction.

Adding a 3D Scene to the Dashboard

To embed a 3D Scene in a dashboard:

Open the Dashboard Designer.
From the Data Visualization tab in the Toolbox, drag and drop the 3D Scene component onto the design area.
Click the Configure 3D Scene button on the component.
In the 3D Scene Settings popup, choose an existing scene, optionally set parameters, and click OK.

The selected 3D Scene now appears on the dashboard. You can further configure its appearance and behavior through the Inspector Panel.

Inspector Panel Properties

The Inspector Panel lets you customize the 3D Scene’s appearance, layout, behavior, and interactions:

1. Animation

Entrance Animation: Choose how the 3D Scene appears on load. Options include SlideIn, BackIn, and others. You can set Delay (s) and Duration (s).

2. Interaction

Scenario Name: Set a custom name for the 3D scenario.
Cross Filter: Enable or disable interaction with other dashboard components (default is True).
Jump To: Link to another dashboard scenario, report, or URL. You can configure it per data layer.
Visible Menu Items: Select filtering and sorting options to display.
Pin Annotation: Set to True to keep annotations fixed on the scene.
Context Menu Actions: Choose available context menu options—All or Jump.
Click Action: Define behavior when the scene is clicked:
- None: No action.
- Jump: Opens a linked target.
- Command: Triggers dashboard-level actions (see below).

3. Title

Show Title: Toggle visibility of the title.
Title: Edit the scene title.
Alignment: Left, Center, or Right.
Title Font Settings: Customize font family, size, weight, and color.
Padding: Set padding around the title area.

4. Layout

X/Y Position: Set component’s position.
Width/Height: Define size (minimum size: 8x8 units).

5. Appearance

Background Color/Image: Set a color or use an image (embedded, shared, or external).
Padding/Margin: Define spacing.
Visibility: Toggle visibility on the dashboard.
Border: Set color, width, and radius.
Shadow: Apply shadow with customizable color and thickness.

Command Settings for 3D Scene Click Actions

You can trigger dashboard-level commands by selecting Command under the Click Action property. Supported commands include:

Show / Hide / Toggle: Control visibility of other components.
Switch Page / Tab: Navigate between pages or container tabs.
Advanced Interaction Triggers:
- 3D Model Node: Select a node in the 3D scene to trigger actions.
- 3D Data Layer: Trigger based on specific data layers.
- Choose animations for Entrance or Exit, based on selected commands.

Advanced Interactions Using Image Components

You can control 3D Scene behavior using image components and commands. Below are common examples:

1. Control Auto Loop

Create a play/pause toggle for the 3D scene's animation loop:

Add a 3D Scene and an Image component.
On the image’s Click Action, select Command.
Choose 3D Scene Auto Loop, select the scene, and set the action (e.g., Pause/Resume AutoLoop).

2. Trigger JavaScript in 3D Scene

Use custom JavaScript in the 3D scene for contextual interactions:

Add a 3D Scene with embedded JavaScript (see Create 3D Scene help article).
Add an Image component.
On the image’s Click Action, select Command > 3D Scene Dynamic Script.
Choose the target scene and specify the script function to run.

3. Control 3D Scene Animation

Trigger or pause a specific animation:

Add a 3D Scene and Image component.
On the image’s Click Action, select Command > 3D Scene Animation.
Choose the animation name and action (e.g., Pause/Resume).

Using the Action Menu

When previewing a dashboard, the 3D Scene Action Menu provides tools to:

Zoom in/out
Configure the scene
Add annotations
Share content
Remove the component

Conclusion

The 3D Scene component in Wyn enables rich, interactive visual storytelling through immersive 3D environments. By leveraging command actions, JavaScript integration, and responsive interaction, you can build dashboards that go far beyond traditional visualizations. Whether modeling operations, navigating facilities, or simulating environments, 3D Scenes open a powerful dimension for data engagement.