Report Visualizations
Transform your data into compelling visual stories with interactive charts, graphs, and data visualizations powered by D3.js and Recharts.
Visualization Overview#
Data visualizations are essential for communicating complex information clearly and memorably. PromptReports provides a powerful suite of visualization tools built on D3.js and Recharts, enabling you to create everything from simple bar charts to sophisticated interactive dashboards.
Visualizations can be added to any section of your report. They automatically adapt to different export formats, ensuring your charts look great whether viewed online, in PDF, or in presentation mode.
20+ Chart Types
From basic bar charts to complex tree maps and Sankey diagrams.
Interactive
Hover tooltips, click actions, zoom, and drill-down capabilities.
Customizable
Full control over colors, styles, labels, and formatting.
Chart Types#
Choose the right visualization type for your data and message. Each chart type has specific strengths for different analytical purposes.
| Chart Type | Best For | Data Requirements |
|---|---|---|
| Bar Chart | Comparing categories, showing rankings | Categories + values |
| Line Chart | Trends over time, continuous data | Time series data |
| Pie Chart | Part-to-whole relationships, composition | Categories with percentages |
| Area Chart | Cumulative totals, stacked comparisons | Time series with categories |
| Scatter Plot | Correlations, distributions | Two numeric variables |
| Heat Map | Patterns across two dimensions | Matrix data |
| Tree Map | Hierarchical data, nested categories | Hierarchical structure |
| Sankey Diagram | Flows and transitions | Source-target-value data |
| Gauge | Progress, KPIs, targets | Single value with range |
| Radar Chart | Multi-variable comparison | Multiple metrics per item |
Bar & Column Charts
Horizontal or vertical bars for comparing discrete categories. Supports stacked, grouped, and percentage modes.
Line & Area Charts
Show trends and changes over time. Multiple series, smoothing options, and area fills available.
Pie & Donut Charts
Display part-to-whole relationships. Interactive slices with labels and legends.
Trend & Sparklines
Compact inline charts for showing trends within text or tables.
Geographic Maps
Choropleth maps, point maps, and regional data visualization.
Flow Diagrams
Sankey diagrams and flow charts for process and relationship visualization.
Adding Visualizations#
Add visualizations to your report through the editor toolbar or by using the visualization panel. The process is designed to be intuitive while offering powerful configuration options.
Open the Visualization Panel
Select Chart Type
Input or Connect Data
Configure Mappings
Customize Appearance
Insert and Position
Quick Insert
Data Sources#
Visualizations can be powered by various data sources, from simple manual entry to live data connections.
Manual Entry
Enter data directly in the chart editor. Ideal for small datasets and custom figures.
File Upload
Upload CSV, Excel, or JSON files. Data is parsed and mapped automatically.
Data Connections
Connect to external databases, APIs, or data warehouses for live data.
AI-Generated Data
Let AI research and compile data for your visualizations based on your topic.
Category,Q1 2024,Q2 2024,Q3 2024,Q4 2024
Product A,150000,175000,195000,220000
Product B,85000,92000,105000,118000
Product C,45000,52000,48000,55000
Product D,120000,135000,145000,160000{
"data": [
{ "category": "Product A", "revenue": 220000, "growth": 15.2 },
{ "category": "Product B", "revenue": 118000, "growth": 12.4 },
{ "category": "Product C", "revenue": 55000, "growth": 8.1 },
{ "category": "Product D", "revenue": 160000, "growth": 10.3 }
]
}Customizing Charts#
Every aspect of your visualizations can be customized to match your report's style and effectively communicate your message.
| Customization Area | Options | Purpose |
|---|---|---|
| Colors | Custom palettes, gradients, brand colors | Visual consistency and emphasis |
| Typography | Font family, size, weight for all text | Readability and branding |
| Axes | Labels, tick marks, gridlines, scale type | Data interpretation |
| Legend | Position, orientation, interactive toggle | Series identification |
| Tooltips | Content, formatting, positioning | Detailed data on hover |
| Annotations | Callouts, reference lines, highlights | Drawing attention to key points |
| Animation | Entrance effects, transitions, duration | Engagement (online only) |
Color Accessibility
Interactive Features#
Online reports support rich interactivity that helps readers explore and understand your data more deeply. These features enhance engagement while maintaining clarity.
Hover Tooltips
Display detailed information when hovering over data points. Fully customizable content and formatting.
Legend Filtering
Click legend items to show/hide data series. Great for comparing specific categories.
Zoom & Pan
Zoom into dense data areas and pan to explore. Essential for large datasets.
Drill Down
Click to explore deeper levels of hierarchical data. Navigate through data dimensions.
Note that interactive features are preserved in web-based reports but converted to static images in PDF exports. Consider providing both formats when interactivity is important.
AI-Generated Charts#
PromptReports can automatically generate appropriate visualizations based on your report content and data. This feature saves time and ensures visualizations effectively support your narrative.
Enable Auto-Visualization
Review Suggestions
Accept or Modify
Data Verification
Data Accuracy
Best Practices#
Follow these guidelines to create effective, professional visualizations that enhance your reports:
Choose the Right Chart
Match chart type to your data and message. Don't use 3D effects or complex charts when simple ones work better.
Use Color Purposefully
Use color to highlight key data points. Maintain consistency across charts. Consider colorblind users.
Label Clearly
Include descriptive titles, axis labels, and units. Make sure the chart can stand alone.
Tell a Story
Visualizations should support your narrative. Add annotations to highlight key insights.
Visualization Checklist
- The chart type matches the data and message
- All axes and legends are clearly labeled
- Data is accurate and up-to-date
- Colors are accessible and meaningful
- The chart has a clear title and source citation
- Interactive features work as expected (for web)
- The chart renders correctly in all export formats