sockets and wires - blossommerz/locus-hub GitHub Wiki
Home > Sockets & wires
< Previous: How the node graph works | Next: Adding & connecting nodes >
How the node graph encodes data types - the socket colors and shapes, and what a wire's color and thickness tell you.
Every connection in the node graph carries typed data, and Locus encodes that type into how the socket and its wire look. Once you can read the colors and shapes, you can trace what any wire is carrying without clicking anything.
Each data type has its own color and its own shape, so you can tell types apart even at a glance (and even if color is hard to distinguish). A wire is drawn in the color of the type it carries, so both ends and the line between them match.
| Type | Color | Shape | What it carries |
|---|---|---|---|
| Number |
#cc5de8 grape |
open ring | a plain value |
| Point |
#4dabf7 blue |
filled circle | a position |
| Curve |
#40c057 green |
triangle | a line or contour |
| Region |
#ff922b orange |
filled square | a filled area |
| Boolean |
#f06595 pink |
right-pointing triangle | an on/off flag |
| Color |
#fcc419 yellow |
filled hexagon | an RGBA color |
| Image |
#22b8cf cyan |
outline square | a raster image |
| String |
#aeb6bf slate grey |
pentagon | text |
| Trigger |
#845ef7 violet |
hollow diamond | a pulse (execution) that runs a manual node |
| Any |
#7c8a86 neutral grey |
filled circle (same as point) | a flexible socket that adopts whatever you give it |
Because a wire takes its color from the type it carries, color-coding tells you the flow at a glance. The Any socket is the interesting case: it adopts the type of whatever passes through it. Wire a region into an any socket and that socket and its wire read as a region (orange); wire in points and they read blue. The color you see is the live type - so an any wire still tells you exactly what it's carrying.
Color tells you what type a wire carries; thickness tells you how many. A wire carrying a single value is a thin line. A wire carrying more than one thing - several points, a whole set of tiles - is drawn thick, as a translucent casing around a solid core.
A fat wire is your cue that a list is moving down that connection, not a single item - which matters because one operation placed on a list applies across every item in it.
Tip
If a wire looks heavier than its neighbors, it's carrying a list. Fat wires downstream of a node like Collect or an Array tell you the list survived the operation.
< Previous: How the node graph works | Next: Adding & connecting nodes >
- How the node graph works: nodes, sockets, wires, and live evaluation
- Adding & connecting nodes
- Data-type reference