Visualizations
When you chat with AI and ask about your infrastructure, molecules can render custom visualizations in the conversation. Instead of just text responses, you see rich displays tailored to what you're asking about.
Why Visualizations Matter
When you ask AI about deployments, services, or applications, you need to see the information in the most useful format. Visualizations make AI responses more valuable by:
- Visualizing complex data: See deployment timelines, dependency graphs, and metrics instead of raw text
- Providing actionable context: Charts and graphs reveal patterns and issues at a glance
- Making comparisons easier: Side-by-side displays help you spot differences quickly
- Showing live data: Embedded dashboards and real-time metrics stay current
- Enabling exploration: Interactive elements let you drill into details without new queries
How It Works
A visualization is a React component bundled with a molecule. When AI uses a tool that returns structured data, the visualization renders that data in the chat.
Chat Question → AI Tool Call → Structured Data → Visualization Renders
For example:
- Ask about deployment history. See a timeline visualization.
- Ask about service dependencies. See a graph visualization.
- Ask about dashboard metrics. See an embedded chart.
- Ask about image composition. See a layer breakdown.
Visualizations appear automatically when relevant. Molecules decide when to render them based on your question and the data being returned.
Visualization Types
Molecules can provide different kinds of visualizations:
| Type | Use Case | Example |
|---|---|---|
| Chart | Metrics, trends, comparisons | CPU usage over time |
| Graph | Relationships, dependencies | Service dependency map |
| Timeline | Sequential events | Deployment history |
| Table | Structured records | Open pull requests |
| Dashboard | Multi-metric overview | Application health |
Next Steps
- AI Tools — How AI uses tools from your integrations
- Skills — Higher-level workflows over tools
- Discovery — How entities are discovered from your services
- Building Visualizations — Create your own visualization components