Attributes, Mappers, And Legends

Visual encodings begin with graph attributes. The recommended everyday API is the chainable attribute writer API from helios-network: use nodeAttribute(...), edgeAttribute(...), nodeAttributes(...), and edgeAttributes(...) for normal application code. These helpers define missing attributes, write values, and bump attribute versions while preserving the WASM-buffer safety rules internally.

The raw withBufferAccess(...) API still exists and is important for very large bulk writes or advanced integrations, but it is not the clearest API for most examples. Use the chainable writers first; drop down to buffer access only when you need tight control over typed-array views and write loops.

Loading Data With Attributes

This example builds a graph from ordinary application rows. The label attribute is written with nodeAttribute(...), and the labels behavior is configured to read from that attribute. The graph rows could come from JSON, CSV parsing, a database query, or any other loading step.

Load Data Into A Network

Body Header

Render Console

Mapping Numeric Attributes

This example maps data attributes onto visual channels. The score node attribute drives node color and size, while the strength edge attribute drives edge width. Mappers and legends are built-in behaviors, so the code uses helios.behavior.mappers after the instance is ready rather than manipulating renderer internals.

Map Attributes To Visual Channels

Body Header

Render Console

The mapper examples deliberately use named graph attributes instead of hard-coded visual arrays. That keeps the graph portable: the same attributes can also be used by selectors, filters, legends, exports, and saved sessions.