Image Widget Node Configuration Guide

The Image Widget Node displays a static or uploaded image within a Rayven interface. It is typically used for showing diagrams, floorplans, visual references, product photos, or any fixed visual content alongside real-time workflow data.

image-node

What It Does

This node renders a user-uploaded image within a widget on the interface. You can assign it a name and subtitle, control how the header and device label are shown, and optionally group it by label to show different versions per device. The image can also act as a visual reference or background for other contextual widgets.


Step-by-Step: How to Configure the Image Widget Node

1. Add the widget node

Drag the Image Widget Node from the Widgets section onto the workflow canvas.

2. Set widget name

Enter a descriptive title for the widget (e.g., "Floorplan - Sector A").

3. Configure the widget subtitle (optional)

Add a subtitle to provide additional context or a short description.

4. Name the uploaded image

Enter a name to identify the uploaded image file. This is useful if managing multiple image assets.

5. Upload the image

Use the upload control to select an image file (e.g., .jpg, .png, .svg) to display in the widget.

6. Display settings

  • Widget header: Choose to show or hide the widget title bar.

  • Show UID / label name: Toggle whether the device UID or label appears alongside the widget.

7. Interface placement

  • Select one or more interfaces to which this widget should be added.

  • Use Add to Interface to confirm placement.

8. Configure tooltip (optional)

Enable tooltip display and define text to appear when hovering over the widget.

9. Grouping and filtering

  • Number of Widgets to Display:

    • One unified widget (default): All devices share the same image.

    • One widget per label: Display one widget instance per selected label.

  • Select label (if grouping is enabled): Choose the label to filter by (e.g., zone_A, machine_group_1).


Configuration Fields

Field Requirement Description
Widget Name* Required Title shown at the top of the widget.
Widget Subtitle Optional Secondary text shown under the widget name.
Image Name* Required Name to identify the uploaded image.
Upload Image Required Image file to display.
Widget Header Optional Show/hide the header bar with name and subtitle.
Show UID / Label Name Optional Toggle display of UID or device label.
Interface to Link To Optional Target interfaces where the widget will appear.
Tooltip Optional Hover text for additional context.
Number of Widgets to Display Optional Choose one widget per label or a single shared widget.
Select Label Optional Filter widgets by device label (if grouping is enabled).
 

 Example: Display a Machine Layout Image per Label

Scenario: You want to show a labeled schematic for each machine station, with individual widgets per station label.

Configuration:

  • Widget Name: Station Overview

  • Widget Subtitle: Real-Time Machine Layout

  • Image Name: station_layout

  • Upload Image: station_schematic.png

  • Widget Header: Show

  • Show UID / Label Name: Show

  • Tooltip: Enabled – “Click for more detail”

  • Number of Widgets to Display: One per label

  • Select Label: machine_station_group

  • Interfaces: interface2, Analytics

Result:
Each machine label displays its own instance of the Station Overview image widget, tagged with UID/label name, embedded into the selected interfaces.


 Best Practices

  • Use high-resolution images for floorplans or diagrams to ensure legibility.

  • Keep image file sizes small to optimize interface load speed.

  • Use grouping only when distinct visual content is needed per device label.

  • Tooltip text should be short and action-oriented.


Use Cases

  • Display factory floorplans with sensor overlays.

  • Show schematic diagrams of equipment or systems.

  • Embed photos of remote assets (e.g., pump stations, panels).

  • Provide visual orientation for interface users unfamiliar with site layout.


FAQ

Q: What file formats are supported for upload?
A: Most standard image formats are supported, including .jpg, .png, and .svg.

Q: Can I display different images per device?
A: Yes, by enabling One widget per label and uploading different images per label grouping.

Q: Is the image interactive or clickable?
A: No. The widget currently displays static images only. Use tooltips for light interaction or consider using linked widgets.

Q: What if the image does not appear on the interface?
A: Ensure the image was uploaded successfully, added to at least one interface, and that the workflow is published.