Platform Diagrams Overview

Platform Diagrams are interactive, SCADA-style drawings. You build them from a library of equipment symbols and shapes, connect the symbols with lines, and bind elements to Device Variables so the drawing displays live values and reacts to what the equipment is doing.

Overview

Where a Dashboard answers "what are the numbers right now," a Diagram answers "where in the system are those numbers coming from." Diagrams suit electrical distribution, generator and utility monitoring, process flow, and control system architecture documentation.

Every diagram lives in your Organization and is listed under Visualization → Diagrams. Opening one shows the published drawing; the editor is one click away for anyone with the Update Diagram permission.

Video Tutorial

Part of the Visualize stage in the ControlCom Connect data workflow.

Creating a Diagram

Open Visualization → Diagrams, click New Diagram, and give the drawing a name. ControlCom Connect creates it and opens the editor, where you add elements, arrange them on the canvas, bind the ones that display data, and click Publish.

For the full walkthrough, from the create dialog through publishing and viewing the result, see Creating a Diagram.

Elements and Symbols

The top bar of the editor drops basic elements onto the canvas: rectangle, circle, arc, line, text and value. Its + menu adds graphs, radials, buttons, wrappers, images and instance references.

The Library panel holds everything else, in categories you can browse or search across at once:

Category	What it covers
Elements	The same shapes, text, charts, buttons and images as the toolbar.
Icons	The Lucide icon set, drawn as editable geometry rather than images.
Valves, Instruments, Equipment, Piping	P&ID symbols for process drawings.
F&B Processing, Packaging, Storage	Food and beverage plant equipment.
Electrical	Switches, meters, transformers, motors and control gear for one-line and control drawings.

Symbols arrive as groups, and the individual paths inside them stay editable, so you can recolor a symbol or bind one part of it to a Variable without redrawing it. Images are uploaded through the image picker and reused from the Organization's image library.

Live Data and Interactions

A Value element renders the current reading of the Variable it is bound to, and updates in place as new readings arrive. Until the Device reports, it shows -----.

Other properties take logic rather than a fixed setting, which is how a drawing reflects state:

• Fill and Stroke accept color logic, so a breaker turns red when its Variable says it is open.
• Visibility accepts a rule that shows or hides an element, with an optional fade or slide.
• Pulse animates an element while a condition holds.

Where a single Variable is not enough, the logic editor accepts an expression across several Variables. See the Expression Editor for the syntax.

Elements can also be clickable. An interaction navigates to a Dashboard or another Diagram, slides a dashboard out over the drawing, pans to an area of the canvas, sets a local property, or sends a command back to the Device. Sending a command has to be the only interaction on an element.

Diagrams, Instances and Templates

The Diagrams list has a tab for each kind of drawing.

A Diagram is a normal drawing that people open and view. An Instance is a drawing built to be embedded rather than opened on its own, typically one piece of equipment drawn once and reused wherever it appears. A Template is a starting point published for the whole Organization.

You place an instance with the Instance Ref element, which references the instance by name and takes the local property values for that particular placement. Change the instance and every placement follows, which is what keeps a site full of identical transfer switches or panels consistent.

Common Diagram Types

Electrical one-line: utility feed, transfer switches, generator connections, distribution panels, breakers and load monitoring.

Facility layouts: floor plans with Device locations, equipment rooms and data center racks.

Process diagrams: equipment interconnections, material flow and control signal routing.

Diagrams sit alongside dashboards in the Visualize stage, and the two combine: a dashboard can embed a diagram through its Diagram widget, and an element on a diagram can open a dashboard. For the dashboard side, see the dashboards overview.