Graphs And Attributes
Helios Network is a WebAssembly-backed graph store. The graph topology lives in the WASM core, while the JavaScript wrapper provides ergonomic methods for building graphs, attaching attributes, querying data, and serializing snapshots.
The examples on this page use the chainable attribute writer API. These helpers are the recommended default for application code because they define missing attributes, infer practical schemas, write values, and bump versions in one place.
Create A WASM-Backed Graph
This first data example creates a directed graph, adds nodes and edges, and logs the allocated ids. Node and edge ids are stable integer identifiers; they are not necessarily the same thing as ordinal position in an active subset.
Write Attributes With Chainable Helpers
The chainable writers accept scalars, arrays, typed arrays, callbacks, and
multi-attribute records. By default, array-like values are indexed by active
ordinal, which is the right behavior for most imported row data. Pass
{ indexBy: 'id' } when your data array is keyed by graph id.
Write Multiple Attributes Together
Use nodeAttributes(...) and edgeAttributes(...) when several attributes come
from the same row. The callback receives the current value record, entity id,
active ordinal, and the network instance. It can return an array aligned with
the requested names or an object keyed by attribute name.
When writing a graph for visualization, these attributes can be used directly by Helios Web mappers, filters, labels, and selectors.
{"importMap": {"helios-web": "../vendor/helios/helios-web.es.js", "helios-network": "../vendor/helios/helios-network.js"}, "examples": [{"id": "examples--helios-network--graphs-attributes.md--example-1", "title": "Create A WASM-Backed Graph", "render": false, "console": true, "autorun": true, "layout": "split", "width": null, "height": "360px", "headerName": null, "headerCode": "", "bodyName": "helios_network_js_creation", "bodyCode": "import HeliosNetwork from \"helios-network\";\n\nconst network = await HeliosNetwork.create({ directed: true, initialEdges: 5 });\n\nconst nodes = network.addNodes(5);\nconst edges = network.addEdges([\n [nodes[0], nodes[1]],\n [nodes[1], nodes[2]],\n [nodes[2], nodes[3]],\n [nodes[3], nodes[4]],\n [nodes[0], nodes[4]],\n]);\n\nconsole.log({\n directed: network.directed,\n nodes: network.nodeCount,\n edges: network.edgeCount,\n nodeIds: Array.from(nodes),\n edgeIds: Array.from(edges),\n});", "headerRefs": [], "bodyRefs": []}, {"id": "examples--helios-network--graphs-attributes.md--example-2", "title": "Use Chainable Attributes", "render": false, "console": true, "autorun": true, "layout": "split", "width": null, "height": "430px", "headerName": null, "headerCode": "", "bodyName": "helios_network_attributes", "bodyCode": "import HeliosNetwork from \"helios-network\";\n\nconst network = await HeliosNetwork.create({ directed: true });\nconst nodes = network.addNodes(4);\nconst edges = network.addEdges([\n [nodes[0], nodes[1]],\n [nodes[1], nodes[2]],\n [nodes[2], nodes[3]],\n]);\n\nnetwork\n .nodeAttribute('score', [0.1, 0.4, 0.8, 0.7])\n .nodeAttribute('label', (_current, _id, ordinal) => `node-${ordinal}`)\n .edgeAttribute('weight', (_current, _id, ordinal) => 0.25 + ordinal * 0.25)\n .networkAttribute('title', 'Attribute example');\n\nconsole.log({\n label: network.getNodeStringAttribute('label', nodes[2]),\n scoreInfo: network.getNodeAttributeInfo('score'),\n weightInfo: network.getEdgeAttributeInfo('weight'),\n title: network.getNetworkStringAttribute('title'),\n});", "headerRefs": [], "bodyRefs": []}, {"id": "examples--helios-network--graphs-attributes.md--example-3", "title": "Write Multiple Attributes", "render": false, "console": true, "autorun": true, "layout": "split", "width": null, "height": "420px", "headerName": null, "headerCode": "", "bodyName": "helios_network_multi_attributes", "bodyCode": "import HeliosNetwork from \"helios-network\";\n\nconst network = await HeliosNetwork.create({ directed: false });\nconst nodes = network.addNodes(6);\nconst edges = network.addEdges([\n [nodes[0], nodes[1]], [nodes[1], nodes[2]], [nodes[2], nodes[3]],\n [nodes[3], nodes[4]], [nodes[4], nodes[5]], [nodes[5], nodes[0]],\n]);\n\nnetwork\n .nodeAttributes(['x', 'y'], (_current, _id, ordinal) => [\n Math.cos(ordinal / nodes.length * Math.PI * 2),\n Math.sin(ordinal / nodes.length * Math.PI * 2),\n ])\n .edgeAttributes(['capacity', 'visible'], (_current, _id, ordinal) => ({\n capacity: 10 + ordinal,\n visible: true,\n }));\n\nconsole.log({\n nodeAttributes: network.getNodeAttributeNames(),\n edgeAttributes: network.getEdgeAttributeNames(),\n xInfo: network.getNodeAttributeInfo('x'),\n capacityInfo: network.getEdgeAttributeInfo('capacity'),\n edgeCount: edges.length,\n});", "headerRefs": [], "bodyRefs": []}]}