About This Tool
Purpose
Analytics Dashboard provides comprehensive session insights for Claude Code developers through interactive D3-powered visualizations. Track tool usage, productivity patterns, session metrics, and trends over time with sortable, filterable charts.
Features
- Interactive tool usage bar chart with sorting and tooltips
- Session timeline line chart showing activity over time
- Message type distribution donut chart
- Productivity metrics with trend indicators
- Time-based filtering (day, week, month, all time)
- Sortable charts by value or alphabetically
- Rich tooltips with detailed statistics
- Export capabilities (PNG, SVG, JSON)
- Dark theme optimized for long sessions
- Multi-session aggregation support
Web Research Integration
Source: D3.js Bar Chart - Observable
Techniques Applied:
- scaleBand() for Ordinal Scales: Used D3's scaleBand to create discrete x-axis positioning for categorical data (tools, session dates) with configurable padding between bars
- Interactive Tooltips: Implemented hover-based tooltips with precise positioning that show detailed statistics including percentages, counts, and contextual information
- Dynamic Sorting: Applied D3's groupSort pattern to enable interactive sorting by value (descending/ascending) or alphabetically, re-rendering charts smoothly on demand
- Data Join Pattern: Leveraged D3's .data().join() pattern for efficient DOM updates when filtering or sorting data without full re-renders
Usage
- Click "Load Transcript(s)" to select one or more JSONL transcript files
- View overall statistics cards showing key metrics and trends
- Interact with charts: hover for tooltips, click sort buttons to reorder
- Use time range filters to focus on specific periods
- Export individual charts as PNG/SVG or all data as JSON
Chart Types
- Tool Usage Bar Chart: Shows frequency of each tool used, sortable by usage count or tool name
- Session Timeline: Line chart displaying message activity over time
- Message Distribution: Donut chart breaking down messages by type (user, assistant, tool)
- Productivity Trends: Multi-metric visualization tracking messages per hour, tool diversity, session duration