Network and Flow Visualization AI Prompt

Design a visualization for network or flow data.

Data type: {{data_type}} (customer journey, supply chain, relationship network, conversion funnel, Sankey flow)
Nodes: {{nodes}} (entities)
Edges: {{edges}} (relationships or flows between entities)
Key question: {{question}}

1. Chart type selection:

   Sankey diagram:
   - Shows flow volumes between stages or categories
   - Best for: conversion funnels, budget allocation, material flows
   - Read: width of each flow proportional to volume
   - Limit: < 20 nodes; > 20 becomes unreadable without interaction
   - Tool: Plotly, D3.js, Google Charts

   Alluvial diagram:
   - A Sankey variant showing how categories change over time or across dimensions
   - Best for: before-after category changes, cohort migration
   - Example: how customers moved between subscription tiers from Q1 to Q4

   Network graph:
   - Nodes and edges showing relationships
   - Best for: social networks, dependency graphs, knowledge graphs
   - Layouts:
     - Force-directed: natural clustering, no hierarchy
     - Hierarchical: for tree structures (org chart, taxonomy)
     - Circular: for dense networks where crossing edges are unavoidable
   - Color nodes by: category, cluster membership, or a metric
   - Size nodes by: degree centrality, importance, volume
   - Edge width: proportional to relationship strength

   Chord diagram:
   - Circular diagram showing flows between all pairs of groups
   - Best for: mutual flows (trade between countries, team collaboration)
   - Harder to read than Sankey — use only when bidirectional flows are both important

   Arc diagram:
   - Nodes on a line with arcs above showing connections
   - Best for: temporal networks where order matters

2. Managing complexity:
   - > 50 nodes: aggregate less important nodes into 'Other' category
   - Filter controls: allow users to filter to relevant subgraphs
   - Highlight on hover: fade all non-connected nodes and edges when hovering
   - Community detection: use clustering algorithm to group related nodes; color by cluster

3. Performance for large networks:
   - > 500 nodes: use WebGL-based rendering (Sigma.js, GPU.js)
   - Static alternative: aggregate to a summary view with interactive drill-down

Return: chart type recommendation, layout specification, node and edge encoding, complexity management approach, and tool recommendation.