Charts — Motif Braid Chart — Semiotic

Home · Getting Started · Charts · Features · Playground

This page requires JavaScript for interactive chart demos.

AI / Machine-readable docs: llms.txt · llms-full.txt · Full AI Reference · schema.json · API Reference · Examples

View on GitHub · npx semiotic-ai for CLI access

Machine-readable page content

Canonical: https://semiotic.nteract.io/charts/motif-braid-chart

Motif Braid

charts

import { MotifBraidChart } from "semiotic/atlas"

Wraps: NetworkCustomChart

Shared prefixes, labeled journey steps and measured traffic. Prepare analysis once upstream with semiotic/atlas/core, then share the artifact across readers, JSON exports and static SVG.

Synthetic design fixtures. These stories demonstrate evidence handling, not production findings.

Story

Can an overall conversion gain hide a mobile regression?

Mobile loops rise from 8% to 30% and conversion falls from 10% to 6%, while overall conversion rises from 10% to 10.8%.

Read chart interactions

Focus a mark with the arrow keys and press Space, or click a module. This readout subscribes through ObservationReadout to the chart’s ID inside LinkedCharts. The observation carries the canonical vertex and analysis revision for linked views and inspectors.

No mark activated yet.

Read the evidence

Supported journeys. Each numbered step is a depth. Counts repeat when no per-step counts were supplied; widths do not imply measured attrition.
Cohort	Steps and counts
mobile/control	1. home: 18,400 → 2. catalog: 18,400 → 3. checkout: 18,400 → 4. done: 18,400
mobile/control	1. home: 1,600 → 2. catalog: 1,600 → 3. checkout: 1,600 → 4. redirect: 1,600 → 5. checkout: 1,600 → 6. done: 1,600
mobile/treatment	1. home: 14,000 → 2. catalog: 14,000 → 3. checkout: 14,000 → 4. done: 14,000
mobile/treatment	1. home: 6,000 → 2. catalog: 6,000 → 3. checkout: 6,000 → 4. redirect: 6,000 → 5. checkout: 6,000 → 6. done: 6,000
desktop/control	1. home: 20,000 → 2. catalog: 20,000 → 3. checkout: 20,000 → 4. done: 20,000
desktop/treatment	1. home: 20,000 → 2. catalog: 20,000 → 3. checkout: 20,000 → 4. done: 20,000

Source revision: checkout-ab-v1. Selection and exported evidence retain the complete analysis identity.

The motif is a diagnostic, not proof that the loop caused the full four-point mobile decline.
Hold the mobile rollout under its guardrail; inspect the redirect.

Data dictionary and independent inputs

{ "id": "checkout-ab-v1", "synthetic": true, "label": "Synthetic design fixture. Not a production analysis.", "leadView": "MotifBraidChart", "dataDictionary": { "assigned": "Assigned users in the experiment partition. The A/B denominator.", "loopUsers": "Assigned users with at least one qualifying loop episode. Not raw episode totals.", "purchases": "Assigned users who purchased." }, "inputs": { "mobile": { "control": { "assigned": 20000, "loopUsers": 1600, "purchases": 2000 }, "treatment": { "assigned": 20000, "loopUsers": 6000, "purchases": 1200 } }, "desktop": { "control": { "assigned": 20000, "purchases": 2000 }, "treatment": { "assigned": 20000, "purchases": 3120 } } }, "expected": { "mobileControlLoopBps": 800, "mobileTreatmentLoopBps": 3000, "mobileControlConversionBps": 1000, "mobileTreatmentConversionBps": 600, "overallControlConversionBps": 1000, "overallTreatmentConversionBps": 1080, "denominator": "assigned", "limitations": [ "The motif is a diagnostic, not proof that the loop caused the full four-point mobile decline.", "Hold the mobile rollout under its guardrail; inspect the redirect." ] }, "spec": { "schemaVersion": "0.2", "coordinate": { "kind": "ordinal", "sectionIds": [ "home", "catalog", "checkout", "retry", "outcome" ] }, "relations": { "directed": true, "edgeIdRequired": true, "parallelEdges": "keep-by-id", "selfLoops": "keep-by-id" }, "evidencePolicyId": "atlas-phase2-exact", "measures": { "assigned": { "unitKind": "stock", "countUnit": "entity" }, "loop-users": { "unitKind": "stock", "countUnit": "entity" }, "purchases": { "unitKind": "stock", "countUnit": "entity" } }, "motifs": { "catalogId": "atlas-phase2", "catalogVersion": "0.2.0", "countUnit": "entity", "denominatorRef": "assigned", "anchor": "completion" }, "forest": { "display": { "kind": "observed-prefix", "roots": [ "home" ], "referencePartition": "mobile/control" } }, "comparison": { "partitions": [ "mobile/control", "mobile/treatment" ], "denominatorMeasureId": "assigned", "referencePartition": "mobile/control" }, "dataRevision": "checkout-ab-v1", "temporal": { "kind": "snapshot" } }, "source": { "graphRef": "checkout-ab-v1", "revision": "checkout-ab-v1", "nodes": [ { "id": "home", "sectionId": "home" }, { "id": "catalog", "sectionId": "catalog" }, { "id": "checkout", "sectionId": "checkout" }, { "id": "redirect", "sectionId": "retry" }, { "id": "done", "sectionId": "outcome" } ], "edges": [ { "id": "e-home-catalog", "source": "home", "target": "catalog" }, { "id": "e-catalog-checkout", "source": "catalog", "target": "checkout" }, { "id": "e-checkout-done", "source": "checkout", "target": "done" }, { "id": "e-checkout-redirect", "source": "checkout", "target": "redirect" }, { "id": "e-redirect-checkout", "source": "redirect", "target": "checkout" } ], "occurrences": [ { "id": "mc-ordinary", "entityId": "mobile-control-ordinary", "entityCount": 18400, "partition": "mobile/control", "groupKeys": { "device": "mobile", "loop": "no" }, "nodePath": [ "home", "catalog", "checkout", "done" ], "complete": true }, { "id": "mc-loop", "entityId": "mobile-control-loop", "entityCount": 1600, "partition": "mobile/control", "groupKeys": { "device": "mobile", "loop": "yes" }, "nodePath": [ "home", "catalog", "checkout", "redirect", "checkout", "done" ], "complete": true }, { "id": "mt-ordinary", "entityId": "mobile-treatment-ordinary", "entityCount": 14000, "partition": "mobile/treatment", "groupKeys": { "device": "mobile", "loop": "no" }, "nodePath": [ "home", "catalog", "checkout", "done" ], "complete": true }, { "id": "mt-loop", "entityId": "mobile-treatment-loop", "entityCount": 6000, "partition": "mobile/treatment", "groupKeys": { "device": "mobile", "loop": "yes" }, "nodePath": [ "home", "catalog", "checkout", "redirect", "checkout", "done" ], "complete": true }, { "id": "dc-ordinary", "entityId": "desktop-control-ordinary", "entityCount": 20000, "partition": "desktop/control", "groupKeys": { "device": "desktop", "loop": "no" }, "nodePath": [ "home", "catalog", "checkout", "done" ], "complete": true }, { "id": "dt-ordinary", "entityId": "desktop-treatment-ordinary", "entityCount": 20000, "partition": "desktop/treatment", "groupKeys": { "device": "desktop", "loop": "no" }, "nodePath": [ "home", "catalog", "checkout", "done" ], "complete": true } ], "measureValues": [ { "measureId": "assigned", "subjectId": "mobile/control", "value": 20000, "status": "exact" }, { "measureId": "assigned", "subjectId": "mobile/treatment", "value": 20000, "status": "exact" }, { "measureId": "assigned", "subjectId": "desktop/control", "value": 20000, "status": "exact" }, { "measureId": "assigned", "subjectId": "desktop/treatment", "value": 20000, "status": "exact" }, { "measureId": "assigned", "subjectId": "control", "value": 40000, "status": "exact" }, { "measureId": "assigned", "subjectId": "treatment", "value": 40000, "status": "exact" }, { "measureId": "loop-users", "subjectId": "mobile/control", "value": 1600, "status": "exact" }, { "measureId": "loop-users", "subjectId": "mobile/treatment", "value": 6000, "status": "exact" }, { "measureId": "purchases", "subjectId": "mobile/control", "value": 2000, "status": "exact" }, { "measureId": "purchases", "subjectId": "mobile/treatment", "value": 1200, "status": "exact" }, { "measureId": "purchases", "subjectId": "desktop/control", "value": 2000, "status": "exact" }, { "measureId": "purchases", "subjectId": "desktop/treatment", "value": 3120, "status": "exact" }, { "measureId": "purchases", "subjectId": "control", "value": 4000, "status": "exact" }, { "measureId": "purchases", "subjectId": "treatment", "value": 4320, "status": "exact" } ] } }

Serialized public chart props

JSON

{ "atlas": { "sourceGraphRef": "checkout-ab-v1", "analysisRevision": "[1,\"checkout-ab-v1\",\"checkout-ab-v1\",{\"comparison\":{\"denominatorMeasureId\":\"assigned\",\"partitions\":[\"mobile/control\",\"mobile/treatment\"],\"referencePartition\":\"mobile/control\"},\"coordinate\":{\"kind\":\"ordinal\",\"sectionIds\":[\"home\",\"catalog\",\"checkout\",\"retry\",\"outcome\"]},\"dataRevision\":\"checkout-ab-v1\",\"evidencePolicyId\":\"atlas-phase2-exact\",\"forest\":{\"display\":{\"kind\":\"observed-prefix\",\"referencePartition\":\"mobile/control\",\"roots\":[\"home\"]}},\"measures\":{\"assigned\":{\"countUnit\":\"entity\",\"unitKind\":\"stock\"},\"loop-users\":{\"countUnit\":\"entity\",\"unitKind\":\"stock\"},\"purchases\":{\"countUnit\":\"entity\",\"unitKind\":\"stock\"}},\"motifs\":{\"anchor\":\"completion\",\"catalogId\":\"atlas-phase2\",\"catalogVersion\":\"0.2.0\",\"countUnit\":\"entity\",\"denominatorRef\":\"assigned\"},\"relations\":{\"directed\":true,\"edgeIdRequired\":true,\"parallelEdges\":\"keep-by-id\",\"selfLoops\":\"keep-by-id\"},\"schemaVersion\":\"0.2\",\"temporal\":{\"kind\":\"snapshot\"}}]", "spec": { "schemaVersion": "0.2", "coordinate": { "kind": "ordinal", "sectionIds": [ "home", "catalog", "checkout", "retry", "outcome" ] }, "relations": { "directed": true, "edgeIdRequired": true, "parallelEdges": "keep-by-id", "selfLoops": "keep-by-id" }, "evidencePolicyId": "atlas-phase2-exact", "measures": { "assigned": { "unitKind": "stock", "countUnit": "entity" }, "loop-users": { "unitKind": "stock", "countUnit": "entity" }, "purchases": { "unitKind": "stock", "countUnit": "entity" } }, "motifs": { "catalogId": "atlas-phase2", "catalogVersion": "0.2.0", "countUnit": "entity", "denominatorRef": "assigned", "anchor": "completion" }, "forest": { "display": { "kind": "observed-prefix", "roots": [ "home" ], "referencePartition": "mobile/control" } }, "comparison": { "partitions": [ "mobile/control", "mobile/treatment" ], "denominatorMeasureId": "assigned", "referencePartition": "mobile/control" }, "dataRevision": "checkout-ab-v1", "temporal": { "kind": "snapshot" } }, "source": { "graphRef": "checkout-ab-v1", "revision": "checkout-ab-v1", "nodes": [ { "id": "home", "sectionId": "home" }, { "id": "catalog", "sectionId": "catalog" }, { "id": "checkout", "sectionId": "checkout" }, { "id": "redirect", "sectionId": "retry" }, { "id": "done", "sectionId": "outcome" } ], "edges": [ { "id": "e-home-catalog", "source": "home", "target": "catalog" }, { "id": "e-catalog-checkout", "source": "catalog", "target": "checkout" }, { "id": "e-checkout-done", "source": "checkout", "target": "done" }, { "id": "e-checkout-redirect", "source": "checkout", "target": "redirect" }, { "id": "e-redirect-checkout", "source": "redirect", "target": "checkout" } ], "occurrences": [ { "id": "mc-ordinary", "entityId": "mobile-control-ordinary", "entityCount": 18400, "partition": "mobile/control", "groupKeys": { "device": "mobile", "loop": "no" }, "nodePath": [ "home", "catalog", "checkout", "done" ], "complete": true }, { "id": "mc-loop", "entityId": "mobile-control-loop", "entityCount": 1600, "partition": "mobile/control", "groupKeys": { "device": "mobile", "loop": "yes" }, "nodePath": [ "home", "catalog", "checkout", "redirect", "checkout", "done" ], "complete": true }, { "id": "mt-ordinary", "entityId": "mobile-treatment-ordinary", "entityCount": 14000, "partition": "mobile/treatment", "groupKeys": { "device": "mobile", "loop": "no" }, "nodePath": [ "home", "catalog", "checkout", "done" ], "complete": true }, { "id": "mt-loop", "entityId": "mobile-treatment-loop", "entityCount": 6000, "partition": "mobile/treatment", "groupKeys": { "device": "mobile", "loop": "yes" }, "nodePath": [ "home", "catalog", "checkout", "redirect", "checkout", "done" ], "complete": true }, { "id": "dc-ordinary", "entityId": "desktop-control-ordinary", "entityCount": 20000, "partition": "desktop/control", "groupKeys": { "device": "desktop", "loop": "no" }, "nodePath": [ "home", "catalog", "checkout", "done" ], "complete": true }, { "id": "dt-ordinary", "entityId": "desktop-treatment-ordinary", "entityCount": 20000, "partition": "desktop/treatment", "groupKeys": { "device": "desktop", "loop": "no" }, "nodePath": [ "home", "catalog", "checkout", "done" ], "complete": true } ], "measureValues": [ { "measureId": "assigned", "subjectId": "mobile/control", "value": 20000, "status": "exact" }, { "measureId": "assigned", "subjectId": "mobile/treatment", "value": 20000, "status": "exact" }, { "measureId": "assigned", "subjectId": "desktop/control", "value": 20000, "status": "exact" }, { "measureId": "assigned", "subjectId": "desktop/treatment", "value": 20000, "status": "exact" }, { "measureId": "assigned", "subjectId": "control", "value": 40000, "status": "exact" }, { "measureId": "assigned", "subjectId": "treatment", "value": 40000, "status": "exact" }, { "measureId": "loop-users", "subjectId": "mobile/control", "value": 1600, "status": "exact" }, { "measureId": "loop-users", "subjectId": "mobile/treatment", "value": 6000, "status": "exact" }, { "measureId": "purchases", "subjectId": "mobile/control", "value": 2000, "status": "exact" }, { "measureId": "purchases", "subjectId": "mobile/treatment", "value": 1200, "status": "exact" }, { "measureId": "purchases", "subjectId": "desktop/control", "value": 2000, "status": "exact" }, { "measureId": "purchases", "subjectId": "desktop/treatment", "value": 3120, "status": "exact" }, { "measureId": "purchases", "subjectId": "control", "value": 4000, "status": "exact" }, { "measureId": "purchases", "subjectId": "treatment", "value": 4320, "status": "exact" } ] }, "sections": { "kind": "ordinal", "sectionIds": [ "home", "catalog", "checkout", "retry", "outcome" ], "nodeIdsBySection": { "home": [ "home" ], "catalog": [ "catalog" ], "checkout": [ "checkout" ], "retry": [ "redirect" ], "outcome": [ "done" ] } }, "motifs": { "catalogId": "atlas-phase2", "catalogVersion": "0.2.0", "matches": [ { "id": "fan-out:checkout", "template": "fan-out", "roles": { "source": "checkout", "destinations": [ "done", "redirect" ] }, "nodePath": [ "checkout", "done", "redirect" ], "edgeIds": [ "e-checkout-done", "e-checkout-redirect" ], "startSectionId": "checkout", "completionSectionId": "retry", "intersectSectionIds": [ "checkout", "outcome", "retry" ], "entityIds": [ "mobile-control-ordinary", "mobile-control-loop", "mobile-treatment-ordinary", "mobile-treatment-loop", "desktop-control-ordinary", "desktop-treatment-ordinary" ], "entityWeights": { "mobile-control-ordinary": 18400, "mobile-control-loop": 1600, "mobile-treatment-ordinary": 14000, "mobile-treatment-loop": 6000, "desktop-control-ordinary": 20000, "desktop-treatment-ordinary": 20000 }, "entityCount": 80000, "flags": { "occurrence": true, "temporal": false, "trajectorySupported": true, "enriched": false } }, { "id": "fan-in:checkout", "template": "fan-in", "roles": { "destination": "checkout", "sources": [ "catalog", "redirect" ] }, "nodePath": [ "checkout", "catalog", "redirect" ], "edgeIds": [ "e-catalog-checkout", "e-redirect-checkout" ], "startSectionId": "checkout", "completionSectionId": "retry", "intersectSectionIds": [ "checkout", "catalog", "retry" ], "entityIds": [ "mobile-control-ordinary", "mobile-control-loop", "mobile-treatment-ordinary", "mobile-treatment-loop", "desktop-control-ordinary", "desktop-treatment-ordinary" ], "entityWeights": { "mobile-control-ordinary": 18400, "mobile-control-loop": 1600, "mobile-treatment-ordinary": 14000, "mobile-treatment-loop": 6000, "desktop-control-ordinary": 20000, "desktop-treatment-ordinary": 20000 }, "entityCount": 80000, "flags": { "occurrence": true, "temporal": false, "trajectorySupported": true, "enriched": false } }, { "id": "serial-chain:home>catalog>checkout", "template": "serial-chain", "roles": { "nodes": [ "home", "catalog", "checkout" ], "start": "home", "end": "checkout" }, "nodePath": [ "home", "catalog", "checkout" ], "edgeIds": [ "e-home-catalog", "e-catalog-checkout" ], "startSectionId": "home", "completionSectionId": "checkout", "intersectSectionIds": [ "home", "catalog", "checkout" ], "entityIds": [ "mobile-control-ordinary", "mobile-control-loop", "mobile-treatment-ordinary", "mobile-treatment-loop", "desktop-control-ordinary", "desktop-treatment-ordinary" ], "entityWeights": { "mobile-control-ordinary": 18400, "mobile-control-loop": 1600, "mobile-treatment-ordinary": 14000, "mobile-treatment-loop": 6000, "desktop-control-ordinary": 20000, "desktop-treatment-ordinary": 20000 }, "entityCount": 80000, "flags": { "occurrence": true, "temporal": false, "trajectorySupported": true, "enriched": false } }, { "id": "serial-chain:catalog>checkout", "template": "serial-chain", "roles": { "nodes": [ "catalog", "checkout" ], "start": "catalog", "end": "checkout" }, "nodePath": [ "catalog", "checkout" ], "edgeIds": [ "e-catalog-checkout" ], "startSectionId": "catalog", "completionSectionId": "checkout", "intersectSectionIds": [ "catalog", "checkout" ], "entityIds": [ "mobile-control-ordinary", "mobile-control-loop", "mobile-treatment-ordinary", "mobile-treatment-loop", "desktop-control-ordinary", "desktop-treatment-ordinary" ], "entityWeights": { "mobile-control-ordinary": 18400, "mobile-control-loop": 1600, "mobile-treatment-ordinary": 14000, "mobile-treatment-loop": 6000, "desktop-control-ordinary": 20000, "desktop-treatment-ordinary": 20000 }, "entityCount": 80000, "flags": { "occurrence": true, "temporal": false, "trajectorySupported": true, "enriched": false } }, { "id": "serial-chain:redirect>checkout", "template": "serial-chain", "roles": { "nodes": [ "redirect", "checkout" ], "start": "redirect", "end": "checkout" }, "nodePath": [ "redirect", "checkout" ], "edgeIds": [ "e-redirect-checkout" ], "startSectionId": "retry", "completionSectionId": "checkout", "intersectSectionIds": [ "retry", "checkout" ], "entityIds": [ "mobile-control-ordinary", "mobile-control-loop", "mobile-treatment-ordinary", "mobile-treatment-loop", "desktop-control-ordinary", "desktop-treatment-ordinary" ], "entityWeights": { "mobile-control-ordinary": 18400, "mobile-control-loop": 1600, "mobile-treatment-ordinary": 14000, "mobile-treatment-loop": 6000, "desktop-control-ordinary": 20000, "desktop-treatment-ordinary": 20000 }, "entityCount": 80000, "flags": { "occurrence": true, "temporal": false, "trajectorySupported": true, "enriched": false } }, { "id": "repeated-state-episode:mc-loop:checkout", "template": "repeated-state-episode", "roles": { "state": "checkout", "occurrence": "mc-loop" }, "nodePath": [ "checkout", "redirect", "checkout" ], "edgeIds": [], "startSectionId": "checkout", "completionSectionId": "checkout", "intersectSectionIds": [ "checkout", "retry" ], "entityIds": [ "mobile-control-loop" ], "entityWeights": { "mobile-control-loop": 1600 }, "entityCount": 1600, "flags": { "occurrence": true, "temporal": false, "trajectorySupported": true, "enriched": false } }, { "id": "repeated-state-episode:mt-loop:checkout", "template": "repeated-state-episode", "roles": { "state": "checkout", "occurrence": "mt-loop" }, "nodePath": [ "checkout", "redirect", "checkout" ], "edgeIds": [], "startSectionId": "checkout", "completionSectionId": "checkout", "intersectSectionIds": [ "checkout", "retry" ], "entityIds": [ "mobile-treatment-loop" ], "entityWeights": { "mobile-treatment-loop": 6000 }, "entityCount": 6000, "flags": { "occurrence": true, "temporal": false, "trajectorySupported": true, "enriched": false } } ], "incompleteCandidates": [], "unsupportedTemplates": [ "split-rejoin-diamond", "shared-upstream-source", "connector-bypass" ] }, "forest": { "kind": "rooted-backbone", "roots": [ "home" ], "rankingPolicyId": "main-transport", "backboneEdgeIds": [ "e-home-catalog", "e-catalog-checkout", "e-checkout-done", "e-checkout-redirect", "e-redirect-checkout" ], "primaryParentEdgeIdByNode": { "catalog": "e-home-catalog", "checkout": "e-catalog-checkout", "redirect": "e-checkout-redirect", "done": "e-checkout-done" } }, "residualEdges": { "residualEdgeIds": [], "originalEdgeIds": [ "e-home-catalog", "e-catalog-checkout", "e-checkout-done", "e-checkout-redirect", "e-redirect-checkout" ] }, "ports": { "hops": [ { "from": "home", "to": "catalog", "occurrenceIds": [ "mc-ordinary" ] }, { "from": "catalog", "to": "checkout", "via": "home", "occurrenceIds": [ "mc-ordinary" ] }, { "from": "checkout", "to": "done", "via": "catalog", "occurrenceIds": [ "mc-ordinary" ] }, { "from": "home", "to": "catalog", "occurrenceIds": [ "mc-loop" ] }, { "from": "catalog", "to": "checkout", "via": "home", "occurrenceIds": [ "mc-loop" ] }, { "from": "checkout", "to": "redirect", "via": "catalog", "occurrenceIds": [ "mc-loop" ] }, { "from": "redirect", "to": "checkout", "via": "checkout", "occurrenceIds": [ "mc-loop" ] }, { "from": "checkout", "to": "done", "via": "redirect", "occurrenceIds": [ "mc-loop" ] }, { "from": "home", "to": "catalog", "occurrenceIds": [ "mt-ordinary" ] }, { "from": "catalog", "to": "checkout", "via": "home", "occurrenceIds": [ "mt-ordinary" ] }, { "from": "checkout", "to": "done", "via": "catalog", "occurrenceIds": [ "mt-ordinary" ] }, { "from": "home", "to": "catalog", "occurrenceIds": [ "mt-loop" ] }, { "from": "catalog", "to": "checkout", "via": "home", "occurrenceIds": [ "mt-loop" ] }, { "from": "checkout", "to": "redirect", "via": "catalog", "occurrenceIds": [ "mt-loop" ] }, { "from": "redirect", "to": "checkout", "via": "checkout", "occurrenceIds": [ "mt-loop" ] }, { "from": "checkout", "to": "done", "via": "redirect", "occurrenceIds": [ "mt-loop" ] }, { "from": "home", "to": "catalog", "occurrenceIds": [ "dc-ordinary" ] }, { "from": "catalog", "to": "checkout", "via": "home", "occurrenceIds": [ "dc-ordinary" ] }, { "from": "checkout", "to": "done", "via": "catalog", "occurrenceIds": [ "dc-ordinary" ] }, { "from": "home", "to": "catalog", "occurrenceIds": [ "dt-ordinary" ] }, { "from": "catalog", "to": "checkout", "via": "home", "occurrenceIds": [ "dt-ordinary" ] }, { "from": "checkout", "to": "done", "via": "catalog", "occurrenceIds": [ "dt-ordinary" ] } ], "graphAdjacency": [ { "source": "home", "target": "catalog", "edgeId": "e-home-catalog" }, { "source": "catalog", "target": "checkout", "edgeId": "e-catalog-checkout" }, { "source": "checkout", "target": "done", "edgeId": "e-checkout-done" }, { "source": "checkout", "target": "redirect", "edgeId": "e-checkout-redirect" }, { "source": "redirect", "target": "checkout", "edgeId": "e-redirect-checkout" } ] }, "ledger": { "entries": [ { "measureId": "assigned", "subjectId": "mobile/control", "subjectKind": "global", "value": 20000, "status": "exact", "unitKind": "stock", "countUnit": "entity" }, { "measureId": "assigned", "subjectId": "mobile/treatment", "subjectKind": "global", "value": 20000, "status": "exact", "unitKind": "stock", "countUnit": "entity" }, { "measureId": "assigned", "subjectId": "desktop/control", "subjectKind": "global", "value": 20000, "status": "exact", "unitKind": "stock", "countUnit": "entity" }, { "measureId": "assigned", "subjectId": "desktop/treatment", "subjectKind": "global", "value": 20000, "status": "exact", "unitKind": "stock", "countUnit": "entity" }, { "measureId": "assigned", "subjectId": "control", "subjectKind": "global", "value": 40000, "status": "exact", "unitKind": "stock", "countUnit": "entity" }, { "measureId": "assigned", "subjectId": "treatment", "subjectKind": "global", "value": 40000, "status": "exact", "unitKind": "stock", "countUnit": "entity" }, { "measureId": "loop-users", "subjectId": "mobile/control", "subjectKind": "global", "value": 1600, "status": "exact", "unitKind": "stock", "countUnit": "entity" }, { "measureId": "loop-users", "subjectId": "mobile/treatment", "subjectKind": "global", "value": 6000, "status": "exact", "unitKind": "stock", "countUnit": "entity" }, { "measureId": "purchases", "subjectId": "mobile/control", "subjectKind": "global", "value": 2000, "status": "exact", "unitKind": "stock", "countUnit": "entity" }, { "measureId": "purchases", "subjectId": "mobile/treatment", "subjectKind": "global", "value": 1200, "status": "exact", "unitKind": "stock", "countUnit": "entity" }, { "measureId": "purchases", "subjectId": "desktop/control", "subjectKind": "global", "value": 2000, "status": "exact", "unitKind": "stock", "countUnit": "entity" }, { "measureId": "purchases", "subjectId": "desktop/treatment", "subjectKind": "global", "value": 3120, "status": "exact", "unitKind": "stock", "countUnit": "entity" }, { "measureId": "purchases", "subjectId": "control", "subjectKind": "global", "value": 4000, "status": "exact", "unitKind": "stock", "countUnit": "entity" }, { "measureId": "purchases", "subjectId": "treatment", "subjectKind": "global", "value": 4320, "status": "exact", "unitKind": "stock", "countUnit": "entity" } ] }, "completeness": { "nodes": { "home": "known", "catalog": "known", "checkout": "known", "redirect": "known", "done": "known" }, "motifs": { "split-rejoin-diamond": "unsupported-template", "shared-upstream-source": "unsupported-template", "connector-bypass": "unsupported-template" }, "traces": "known" }, "provenance": { "sourceRevision": "checkout-ab-v1", "analysisRevision": "[1,\"checkout-ab-v1\",\"checkout-ab-v1\",{\"comparison\":{\"denominatorMeasureId\":\"assigned\",\"partitions\":[\"mobile/control\",\"mobile/treatment\"],\"referencePartition\":\"mobile/control\"},\"coordinate\":{\"kind\":\"ordinal\",\"sectionIds\":[\"home\",\"catalog\",\"checkout\",\"retry\",\"outcome\"]},\"dataRevision\":\"checkout-ab-v1\",\"evidencePolicyId\":\"atlas-phase2-exact\",\"forest\":{\"display\":{\"kind\":\"observed-prefix\",\"referencePartition\":\"mobile/control\",\"roots\":[\"home\"]}},\"measures\":{\"assigned\":{\"countUnit\":\"entity\",\"unitKind\":\"stock\"},\"loop-users\":{\"countUnit\":\"entity\",\"unitKind\":\"stock\"},\"purchases\":{\"countUnit\":\"entity\",\"unitKind\":\"stock\"}},\"motifs\":{\"anchor\":\"completion\",\"catalogId\":\"atlas-phase2\",\"catalogVersion\":\"0.2.0\",\"countUnit\":\"entity\",\"denominatorRef\":\"assigned\"},\"relations\":{\"directed\":true,\"edgeIdRequired\":true,\"parallelEdges\":\"keep-by-id\",\"selfLoops\":\"keep-by-id\"},\"schemaVersion\":\"0.2\",\"temporal\":{\"kind\":\"snapshot\"}}]", "generation": 1, "relationScope": "directed-admitted", "motifCatalogVersion": "0.2.0", "coordinatePolicy": "ordinal:home,catalog,checkout,retry,outcome", "forestRoots": [ "home" ], "rankingPolicyId": "main-transport", "population": "entity", "temporalHorizon": "snapshot", "evidencePolicyId": "atlas-phase2-exact" }, "prefixForest": { "kind": "observed-prefix", "rootIds": [ "home" ], "nodes": [ { "id": "home", "stateId": "home", "prefix": [ "home" ], "parentId": null, "childIds": [ "home>catalog" ], "entityCount": 80000, "occurrenceIds": [ "mc-ordinary", "mc-loop", "mt-ordinary", "mt-loop", "dc-ordinary", "dt-ordinary" ], "partitionCounts": { "mobile/control": 20000, "mobile/treatment": 20000, "desktop/control": 20000, "desktop/treatment": 20000 } }, { "id": "home>catalog", "stateId": "catalog", "prefix": [ "home", "catalog" ], "parentId": "home", "childIds": [ "home>catalog>checkout" ], "entityCount": 80000, "occurrenceIds": [ "mc-ordinary", "mc-loop", "mt-ordinary", "mt-loop", "dc-ordinary", "dt-ordinary" ], "partitionCounts": { "mobile/control": 20000, "mobile/treatment": 20000, "desktop/control": 20000, "desktop/treatment": 20000 } }, { "id": "home>catalog>checkout", "stateId": "checkout", "prefix": [ "home", "catalog", "checkout" ], "parentId": "home>catalog", "childIds": [ "home>catalog>checkout>done", "home>catalog>checkout>redirect" ], "entityCount": 80000, "occurrenceIds": [ "mc-ordinary", "mc-loop", "mt-ordinary", "mt-loop", "dc-ordinary", "dt-ordinary" ], "partitionCounts": { "mobile/control": 20000, "mobile/treatment": 20000, "desktop/control": 20000, "desktop/treatment": 20000 } }, { "id": "home>catalog>checkout>done", "stateId": "done", "prefix": [ "home", "catalog", "checkout", "done" ], "parentId": "home>catalog>checkout", "childIds": [], "entityCount": 72400, "occurrenceIds": [ "mc-ordinary", "mt-ordinary", "dc-ordinary", "dt-ordinary" ], "partitionCounts": { "mobile/control": 18400, "mobile/treatment": 14000, "desktop/control": 20000, "desktop/treatment": 20000 } }, { "id": "home>catalog>checkout>redirect", "stateId": "redirect", "prefix": [ "home", "catalog", "checkout", "redirect" ], "parentId": "home>catalog>checkout", "childIds": [ "home>catalog>checkout>redirect>checkout" ], "entityCount": 7600, "occurrenceIds": [ "mc-loop", "mt-loop" ], "partitionCounts": { "mobile/control": 1600, "mobile/treatment": 6000 } }, { "id": "home>catalog>checkout>redirect>checkout", "stateId": "checkout", "prefix": [ "home", "catalog", "checkout", "redirect", "checkout" ], "parentId": "home>catalog>checkout>redirect", "childIds": [ "home>catalog>checkout>redirect>checkout>done" ], "entityCount": 7600, "occurrenceIds": [ "mc-loop", "mt-loop" ], "partitionCounts": { "mobile/control": 1600, "mobile/treatment": 6000 } }, { "id": "home>catalog>checkout>redirect>checkout>done", "stateId": "done", "prefix": [ "home", "catalog", "checkout", "redirect", "checkout", "done" ], "parentId": "home>catalog>checkout>redirect>checkout", "childIds": [], "entityCount": 7600, "occurrenceIds": [ "mc-loop", "mt-loop" ], "partitionCounts": { "mobile/control": 1600, "mobile/treatment": 6000 } } ], "order": [ "home", "home>catalog", "home>catalog>checkout", "home>catalog>checkout>done", "home>catalog>checkout>redirect", "home>catalog>checkout>redirect>checkout", "home>catalog>checkout>redirect>checkout>done" ], "referencePartition": "mobile/control" }, "comparison": { "partitions": [ "mobile/control", "mobile/treatment" ], "denominatorMeasureId": "assigned", "referencePartition": "mobile/control", "rows": [ { "partition": "mobile/control", "assigned": 20000, "motifUsers": { "repeated-state-episode": 1600 }, "outcomes": { "purchases": 2000 } }, { "partition": "mobile/treatment", "assigned": 20000, "motifUsers": { "repeated-state-episode": 6000 }, "outcomes": { "purchases": 1200 } } ] } }, "width": 900, "height": 560, "chartId": "atlas-reference-checkout", "title": "Mobile checkout A/B", "description": "Can an overall conversion gain hide a mobile regression?", "summary": "Mobile loops rise from 8% to 30% and conversion falls from 10% to 6%, while overall conversion rises from 10% to 10.8%.", "accessibleTable": true }

Prepare, render and share

Use prepareNetworkAtlas(spec, source) in a worker or upstream service. Inspectresult.ok and its admission issues before passing result.atlas to a reader. prepareNetworkAtlasAsync loads preparation lazily; it does not create a worker.

JSX

import { prepareNetworkAtlas } from "semiotic/atlas/core" import { MotifBraidChart } from "semiotic/atlas" import { renderChartWithEvidence } from "semiotic/server" // spec declares motifs and denominators; source supplies supported journeys. const result = prepareNetworkAtlas(spec, source) if (!result.ok) throw new Error(JSON.stringify(result.issues)) const props = { atlas: result.atlas, title: "Supported journeys" } const { svg, evidence } = renderChartWithEvidence("MotifBraidChart", props) <MotifBraidChart {...props} />

Supply stepEntityCounts alongside each occurrence's nodePath when traffic changes at each step. Omitting it keeps entityCount constant. Display ordering, theme and particle controls never change measurements or infer unobserved paths.

On phones the playground keeps the task table and inspector controls available. On desktop, focus marks and use the arrow keys; press Space to activate a vertex. Flow Circuit also supports Enter activation. The full supplier and circuit studies add linked inspectors, matrices and modeled comparisons at Dependency X-Rayand Flow Circuit.

Props

Prop	Type	Required	Default	Description
`atlas`	PreparedNetworkAtlas	—	—	Complete admitted atlas prepared outside React. Required.
`colorScheme`	string \| array \| object	—	—	Palette for supported journey strands.
`onClick`	function	—	—	React callback for the selected step or strand.
`width`	number	—	—	Chart width in pixels.
`height`	number	—	—	Chart height in pixels.
`title`	string	—	—	Visible and accessible name.
`description`	string	—	—	Accessible description.
`summary`	string	—	—	Accessible task summary.
`accessibleTable`	boolean \| object	—	—	Data table, enabled by default.
`chartId`	string	—	—	Stable ID for observations.
`linkedHover`	boolean \| string \| object	—	—	Linked canonical node hover.
`onObservation`	function	—	—	React observation callback.