2D & 3D Visualization Logic

Relevant source files

The following files were used as context for generating this wiki page:

• src/logic/asset_graph.py
• src/visualizations/graph_visuals.py
• src/visualizations/graph_2d_visuals.py
• src/visualizations/formulaic_visuals.py
• ARCHITECTURE.md
• AI_RULES.md

The visualization system generates interactive graphical representations of financial assets and their relationships. It maps complex network data into visual formats including 3D node-link diagrams, 2D charts, and formulaic analysis views. The system relies on Plotly as the primary rendering engine to ensure consistent interactivity across different user interfaces.

Sources: AI_RULES.md, ARCHITECTURE.md

Visualization Framework Architecture

The visualization layer sits between the Core Business Logic Layer and the User Interface Layer. It transforms raw graph data from the AssetRelationshipGraph into Plotly figure objects or structured JSON payloads.

3D Network Visualization

The 3D visualization logic creates a spatial representation of assets (nodes) and their connections (edges). It assigns coordinates, colors, and sizes based on asset attributes and relationship strengths.

Coordinate Generation

Coordinates for assets are generated deterministically. This ensures that the layout remains consistent across different sessions or refreshes when the underlying data is the same. The logic often employs a fixed seed (e.g., seed=42) for positioning algorithms to maintain this stability.

Sources: AUDIT_REPORT.md, src/logic/asset_graph.py

Node and Edge Mapping

The system maps asset classes to specific colors and uses node size to represent importance or market capitalization. Edges represent relationships, where the line thickness or opacity reflects the strength of the link.

Component	Visual Mapping	Logic Source
Nodes	Color by AssetClass	src/visualizations/graph_visuals.py
Nodes	Size by Market Cap / Importance	src/logic/asset_graph.py
Edges	Thickness by Strength (0-1)	src/logic/asset_graph.py
Edges	Color by Relationship Type	src/visualizations/graph_visuals.py

Sources: AUDIT_REPORT.md, src/logic/asset_graph.py

2D and Formulaic Visualizations

Beyond 3D networks, the system provides 2D graphical representations and formulaic analysis views.

2D Graph Visuals

The graph_2d_visuals.py module generates flat representations of the network. This includes traditional 2D scatter plots or simplified network diagrams where 3D depth is not required for clarity.

Sources: src/visualizations/graph_2d_visuals.py

Formulaic Analysis

The formulaic_visuals.py module renders visualizations based on mathematical models. It visualizes metrics such as:

• Correlation matrices
• Risk exposure gradients
• Impact scores from regulatory events

Sources: src/visualizations/formulaic_visuals.py, AUDIT_REPORT.md

Interaction Flow

The system supports two distinct flows for rendering visualizations depending on the environment.

API-Driven Flow (Production)

In the production environment (FastAPI + Next.js), the backend calculates the visualization data and returns a JSON payload. The frontend then renders this using Plotly.js.

Direct Function Flow (Non-Production)

In the Gradio demo environment, the UI calls the visualization functions directly. The logic returns a complete Plotly Figure object which Gradio displays in its interactive component.

Sources: ARCHITECTURE.md

Technical Constraints and Standards

• Library Choice: Plotly is the exclusive library for all interactive charts and 3D network visualizations to maintain style consistency.
• Data Structure: Visualizations must handle standard domain objects like Equity, Bond, and Currency defined in financial_models.py.
• Performance: The system uses deterministic positioning to avoid expensive recalculations of layouts when data hasn't changed.

Sources: AI_RULES.md, AUDIT_REPORT.md

Summary

The 2D & 3D Visualization Logic provides the interface between abstract financial relationships and human-readable graphs. By using deterministic layouts and the Plotly framework, it delivers consistent, interactive insights into asset networks across both web and demo platforms.