1. Overview

The DeepSeek API Usage Analytics Dashboard is a purely browser-side data visualization tool. Simply drag your monthly CSV billing files exported from the DeepSeek Platform onto the page to instantly get:

• Cost Analysis: Total cost, daily cost trends, per API Key cost breakdown
• Usage Analysis: Total tokens, per-key usage details, request counts
• Cache Analysis: Cache hit rate, daily hit rate trends, per-key hits vs. misses comparison
• Trend Analysis: Freely switch between four metrics — cost / tokens / hit rate / requests

Key Feature: All data parsing and chart rendering happens locally in your browser. CSV files are never uploaded to any server, ensuring your billing data privacy.

2. Quick Start

2.1 Export CSV from DeepSeek Platform

1. Log in to DeepSeek Platform
2. Go to the "Usage" page
3. Select the month you want to analyze, click "Export"
4. Each month exports two CSV files:

• amount-YYYY-M.csv — Usage details (tokens consumed, request counts, cache hit/miss data)
• cost-YYYY-M.csv — Cost details (daily cost data)

2.2 Upload CSV Files

1. Open the dashboard page (landing page by default)
2. Drag the downloaded CSV files (multiple months supported) directly onto the upload area in the center of the page
3. You can also click the upload area to select files via the system file picker
4. The upload area will show a "Processing CSV…" loading state
5. Once processing is complete, the page automatically switches to the dashboard view

2.3 View Analytics

After upload completes, the page automatically displays:

• Top KPI cards (total cost, total tokens, cache hit rate, active API Keys)
• Switch between different analysis views via the tab bar below
• If multiple models are detected, use the model filter to view data for a specific model

3. Navigation Bar

The top navigation bar is fixed at the top of the page and shared between the landing page and dashboard views. It includes:

The navigation bar has a thin bottom border and floats above all content.

4. Dashboard Interface

After CSV files are successfully parsed, the page automatically switches from the landing page to the dashboard view.

4.1 Action Bar

Located at the top of the page, with two sections:

Left — File Info:

• Displays the filename label (e.g., 2026-5 or 2026-5 ~ 2026-6 for multiple months)
• Displays the date range (e.g., 2026-05-01 — 2026-05-31)

Right — Action Buttons:

• Load Different Files: Click to open the file picker and load new CSV files (replaces current data)
• Clear (red text): Clears all current data and returns to the landing page

4.2 Error and Warning Messages

Error Banners

Displayed when CSV parsing encounters critical errors, including:

• Error type title (e.g., "CSV Format Not Recognized", "CSV Parse Error", "Empty File", "Incomplete Upload")
• Detailed error description
• Row and column number where the error occurred (if applicable)

Visual style: light red background + red border + red text.

Warning Banners

Displayed when data has non-critical issues, each warning shown as an independent banner:

• Possible warning types: date mismatch, missing cost data, incomplete cache data, schema drift

Visual style: light amber background + amber border + amber text.

4.3 KPI Cards

"No-card" design: 4-column full-width large numbers + fine labels, separated by thin horizontal dividers.

4.4 Tab Navigation and Model Filter

Tab Navigation

Apple-style underline tabs, 4 tabs:

• Selected tab: 2px bottom border + primary text color
• Unselected tab: no bottom border + tertiary text color
• Smooth fade-in transition on tab switch

Model Filter

Automatically displayed when data contains 2 or more models. Apple-style pill segmented control:

• All Models: Default selection, shows merged data for all models
• Individual Model Name: Click to view data for that specific model

Visual: rounded pill group, selected item has dark fill + white text, unselected items have transparent background + gray text.

4.5 Overview View

Hero Number

• Large number: Extra-large bold total cost amount
• Label: "Total Cost"
• Date range: Time range covered by the data

Daily Cost Bar Chart

• Type: ECharts bar chart
• Content: Daily cost totals, dark bars with slightly rounded tops
• Interaction: hover tooltips (showing specific date and cost amount)
• X-axis labels auto-rotate when more than 15 days

Cost by Key Donut Chart

• Type: ECharts donut chart
• Content: Per API Key cost proportions
• Legend: vertically aligned on the right
• Interaction: hover highlights labels

4.6 By Key View

Hero Number

• Large number: Active API Key count
• Label: "Active API Keys"
• Subtitle: Key count and model count

Per-Key Details Table

Full-width table with the following columns:

Table rows have a subtle background color change on hover.

4.7 Cache View

With Cache Data

Hero Number

• Large number: Cache hit rate percentage
• Label: "Cache Hit Rate"
• Subtitle: Token count served from cache

Daily Cache Hit Rate Trend

• Type: ECharts line chart
• Content: Daily cache hit rate trend (0-100%)
• Style: green line + very light green semi-transparent area fill

Per-Key Cache Hits vs. Misses Stacked Bar Chart

• Type: ECharts stacked bar chart
• Content: Cache hits (green) and misses (gray) token counts per key
• Legend: "Cache Hits" and "Cache Misses" at the bottom

Without Cache Data

• Centered icon + "No Cache Usage Detected" title
• "Enable prompt caching in your DeepSeek API calls to reduce costs." hint text

4.8 Trends View

Hero Number (Dynamic)

• Dynamically displays the aggregate value for the currently selected metric
• Format auto-switches by metric type: cost / tokens / cache hit rate / requests

Metric Switcher

• 4 text labels: Daily Cost / Daily Tokens / Cache Hit Rate / Request Count
• Selected label has an underline
• Hero number and chart update synchronously on switch

Multi-Metric Line Chart

• Type: ECharts line chart
• Content: Daily trend for the currently selected metric
• Style: dark line + very light gradient area fill
• Built-in zoom enabled when date range exceeds 30 days

5. Global Features

5.1 Language Switching

Location: right side of the top navigation bar, Apple-style pill segmented control.

• EN: Switch to English interface
• 中文: Switch to Chinese interface

Language preference is automatically saved to browser local storage and restored on the next visit. Auto-detected from browser language on first visit.

5.2 Theme Switching (Light/Dark)

Location: far right of the top navigation bar, circular icon button.

• Light Mode: Cold gray paper-texture background, dark text
• Dark Mode: Pure black background, light text

Theme preference is automatically saved to browser local storage, with system preference as the initial default.

5.3 Multi-Month Merge

Supports uploading multiple months of CSV files simultaneously. Merge rules:

1. The system reads each filename and extracts the year-month key
2. Amount and cost files from the same month are automatically paired
3. Only months with both amount and cost files are included in the analysis
4. After pairing, all monthly data is merged into a single continuous CSV text for parsing
5. The file label automatically updates to the range format

6. CSV File Format

Amount CSV Format

Cost CSV Format

Notes

• Files must be UTF-8 encoded
• Column names must match exactly (case-sensitive)
• Optional columns are ignored and will not affect parsing

7. Privacy & Security

8. Troubleshooting