mirrors / lukilabs--beautiful-mermaid

项目文件夹

lukilabs--beautiful-mermaid
文件
main
T
wehub-resource-sync 8586632e97 chore: import upstream snapshot with attribution
2026-07-13 12:24:14 +08:00

1017 行
37 KiB
TypeScript
原始文件 永久链接 Blame 文件历史

/**
* XY Chart sample definitions for the beautiful-mermaid visual test suite.
*
* Contains ~100 xychart-beta examples covering bar charts, line charts,
* combined charts, axis configurations, horizontal orientation, titles,
* large datasets, edge cases, and real-world scenarios.
*/
export interface Sample {
title: string
description: string
source: string
/** Optional category tag for grouping in the Table of Contents */
category?: string
}
export const xychartSamples: Sample[] = [
// ══════════════════════════════════════════════════════════════════════════
// BASIC BAR CHARTS
// ══════════════════════════════════════════════════════════════════════════
{
title: 'Simple Bar Chart',
category: 'Basic Bar Charts',
description: 'A minimal bar chart with three data points.',
source: `xychart-beta
title "Simple Bar Chart"
x-axis [A, B, C]
bar [10, 20, 30]`,
},
{
title: 'Five-Category Bars',
category: 'Basic Bar Charts',
description: 'Bar chart with five categories and varied values.',
source: `xychart-beta
title "Product Sales"
x-axis [Widgets, Gadgets, Gizmos, Doodads, Thingamajigs]
bar [150, 230, 180, 95, 310]`,
},
{
title: 'Descending Values',
category: 'Basic Bar Charts',
description: 'Bars sorted in descending order to show ranking.',
source: `xychart-beta
title "Browser Market Share"
x-axis [Chrome, Safari, Firefox, Edge, Other]
bar [65, 19, 8, 5, 3]`,
},
{
title: 'Single Bar',
category: 'Basic Bar Charts',
description: 'A bar chart with only two data points.',
source: `xychart-beta
title "Q1 vs Q2"
x-axis [Q1, Q2]
bar [4500, 5200]`,
},
{
title: 'Eight-Category Bars',
category: 'Basic Bar Charts',
description: 'Bar chart with eight categories and varied heights.',
source: `xychart-beta
title "Department Headcount"
x-axis [Eng, Sales, Marketing, Support, HR, Finance, Legal, Ops]
bar [45, 32, 18, 25, 8, 12, 6, 15]`,
},
{
title: 'Small Values',
category: 'Basic Bar Charts',
description: 'Bar chart with small integer values under 10.',
source: `xychart-beta
title "Daily Bugs Found"
x-axis [Mon, Tue, Wed, Thu, Fri]
bar [3, 7, 2, 5, 1]`,
},
{
title: 'Uniform Values',
category: 'Basic Bar Charts',
description: 'Bars with nearly identical heights.',
source: `xychart-beta
title "Consistent Output"
x-axis [Week 1, Week 2, Week 3, Week 4]
bar [100, 102, 99, 101]`,
},
{
title: 'Wide Range',
category: 'Basic Bar Charts',
description: 'Bars with a wide range of values from small to large.',
source: `xychart-beta
title "City Population (thousands)"
x-axis [Town A, Town B, City C, Metro D, Mega E]
bar [5, 25, 150, 800, 3500]`,
},
{
title: 'Ten-Category Bars',
category: 'Basic Bar Charts',
description: 'Bar chart with ten data points showing monthly figures.',
source: `xychart-beta
title "Monthly Signups"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct]
bar [120, 145, 190, 210, 250, 280, 310, 295, 340, 380]`,
},
{
title: 'Bars With Y-Axis Range',
category: 'Basic Bar Charts',
description: 'Bar chart with an explicit y-axis range.',
source: `xychart-beta
title "Test Scores"
x-axis [Alice, Bob, Carol, Dave, Eve]
y-axis "Score" 0 --> 100
bar [85, 72, 91, 68, 95]`,
},
// ══════════════════════════════════════════════════════════════════════════
// BASIC LINE CHARTS
// ══════════════════════════════════════════════════════════════════════════
{
title: 'Simple Line Chart',
category: 'Basic Line Charts',
description: 'A line chart showing a gentle upward trend with natural variation.',
source: `xychart-beta
title "Simple Trend"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug]
line [100, 118, 148, 140, 150, 162, 155, 180]`,
},
{
title: 'Upward Trend',
category: 'Basic Line Charts',
description: 'Line chart showing a steady upward trend.',
source: `xychart-beta
title "Revenue Growth"
x-axis [2019, 2020, 2021, 2022, 2023]
line [500, 620, 780, 950, 1200]`,
},
{
title: 'Downward Trend',
category: 'Basic Line Charts',
description: 'Line chart showing a declining trend.',
source: `xychart-beta
title "Declining Defect Rate"
x-axis [Sprint 1, Sprint 2, Sprint 3, Sprint 4, Sprint 5, Sprint 6]
line [25, 20, 15, 12, 8, 5]`,
},
{
title: 'Oscillating Values',
category: 'Basic Line Charts',
description: 'Line chart with values that rise and fall repeatedly.',
source: `xychart-beta
title "Daily Temperature Variation"
x-axis [Mon, Tue, Wed, Thu, Fri, Sat, Sun]
line [18, 22, 17, 24, 19, 26, 20]`,
},
{
title: 'Large Scale Line',
category: 'Basic Line Charts',
description: 'Line chart with values in the thousands.',
source: `xychart-beta
title "Website Visitors"
x-axis [Jan, Feb, Mar, Apr, May, Jun]
y-axis "Visitors" 0 --> 50000
line [12000, 18000, 25000, 31000, 38000, 45000]`,
},
{
title: 'Flat Line',
category: 'Basic Line Charts',
description: 'A line chart where values remain approximately constant.',
source: `xychart-beta
title "Stable Metric"
x-axis [W1, W2, W3, W4, W5, W6]
line [50, 51, 49, 50, 52, 50]`,
},
{
title: 'Spike Pattern',
category: 'Basic Line Charts',
description: 'Line chart with a dramatic spike in the middle.',
source: `xychart-beta
title "Traffic Spike"
x-axis [6am, 7am, 8am, 9am, 10am, 11am, 12pm, 1pm, 2pm, 3pm, 4pm, 5pm, 6pm]
line [200, 250, 350, 650, 1200, 2800, 4500, 3800, 2800, 1600, 900, 500, 300]`,
},
{
title: 'V-Shape Recovery',
category: 'Basic Line Charts',
description: 'Line chart showing a sharp decline followed by recovery.',
source: `xychart-beta
title "Stock Price Recovery"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct]
line [100, 85, 65, 48, 38, 40, 52, 68, 82, 95]`,
},
{
title: 'Step Pattern',
category: 'Basic Line Charts',
description: 'Line chart with staircase-like jumps between plateaus.',
source: `xychart-beta
title "Pricing Tiers"
x-axis [Free, Basic, Pro, Team, Enterprise]
line [0, 10, 25, 50, 100]`,
},
{
title: 'Two Lines',
category: 'Basic Line Charts',
description: 'Two line series plotted on the same chart.',
source: `xychart-beta
title "Planned vs Actual"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug]
line [100, 145, 190, 240, 280, 320, 360, 400]
line [90, 130, 185, 235, 275, 340, 380, 420]`,
},
// ══════════════════════════════════════════════════════════════════════════
// COMBINED BAR + LINE
// ══════════════════════════════════════════════════════════════════════════
{
title: 'Bar and Line Overlay',
category: 'Combined Bar + Line',
description: 'Bars with a line overlaid showing the same data as a trend.',
source: `xychart-beta
title "Monthly Revenue"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct, Nov, Dec]
y-axis "Revenue (USD)" 0 --> 10000
bar [4200, 5000, 5800, 6200, 5500, 7000, 7800, 7200, 8400, 8100, 9000, 9200]
line [4200, 5000, 5800, 6200, 5500, 7000, 7800, 7200, 8400, 8100, 9000, 9200]`,
},
{
title: 'Bar with Trend Line',
category: 'Combined Bar + Line',
description: 'Bars showing actual values with a line showing the moving average trend.',
source: `xychart-beta
title "Sales with Trend"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct, Nov, Dec]
bar [300, 380, 280, 450, 350, 520, 420, 550, 480, 610, 530, 680]
line [300, 330, 320, 353, 352, 395, 390, 420, 418, 460, 458, 498]`,
},
{
title: 'Bar with Target Line',
category: 'Combined Bar + Line',
description: 'Bars showing actual performance with a flat target line.',
source: `xychart-beta
title "Performance vs Target"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct, Nov, Dec]
y-axis "Units" 0 --> 600
bar [320, 380, 410, 350, 380, 520, 290, 440, 480, 510, 450, 530]
line [400, 400, 400, 400, 400, 400, 400, 400, 400, 400, 400, 400]`,
},
{
title: 'Revenue and Profit',
category: 'Combined Bar + Line',
description: 'Bars for revenue with a line for profit margin.',
source: `xychart-beta
title "Revenue and Profit"
x-axis [23Q1, 23Q2, 23Q3, 23Q4, 24Q1, 24Q2, 24Q3, 24Q4]
bar [4200, 4800, 5500, 6200, 6800, 7200, 7600, 8100]
line [1000, 1200, 1450, 1700, 1900, 2100, 2350, 2600]`,
},
{
title: 'Dual Dataset Overlay',
category: 'Combined Bar + Line',
description: 'Two bars and one line series for multi-metric comparison.',
source: `xychart-beta
title "Orders, Returns, and Net"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug]
bar [200, 230, 260, 300, 280, 310, 340, 350]
bar [20, 25, 28, 30, 35, 28, 25, 22]
line [180, 205, 232, 270, 245, 282, 315, 328]`,
},
{
title: 'Costs vs Revenue',
category: 'Combined Bar + Line',
description: 'Bars for costs with a line showing revenue growth.',
source: `xychart-beta
title "Costs vs Revenue"
x-axis [2018, 2019, 2020, 2021, 2022, 2023, 2024, 2025]
bar [350, 370, 400, 420, 450, 440, 460, 470]
line [220, 280, 350, 480, 620, 780, 950, 1100]`,
},
{
title: 'Bar with Two Lines',
category: 'Combined Bar + Line',
description: 'Bars with two overlaid line series for comparison.',
source: `xychart-beta
title "Actual, Forecast, Target"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct, Nov, Dec]
bar [100, 110, 115, 125, 130, 140, 135, 145, 150, 155, 158, 165]
line [95, 105, 115, 125, 130, 138, 142, 148, 152, 158, 162, 168]
line [130, 130, 130, 130, 130, 130, 130, 130, 130, 130, 130, 130]`,
},
{
title: 'Stacked Context',
category: 'Combined Bar + Line',
description: 'Multiple bar series with a line showing the total.',
source: `xychart-beta
title "Channel Performance"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug]
bar [100, 108, 118, 130, 140, 148, 155, 165]
bar [80, 84, 88, 95, 100, 105, 108, 115]
line [180, 192, 206, 225, 240, 253, 263, 280]`,
},
{
title: 'Cumulative Line Over Bars',
category: 'Combined Bar + Line',
description: 'Monthly bars with a cumulative line showing running total.',
source: `xychart-beta
title "Monthly and Cumulative Sales"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct, Nov, Dec]
bar [80, 100, 120, 150, 140, 170, 180, 160, 190, 200, 210, 220]
line [80, 180, 300, 450, 590, 760, 940, 1100, 1290, 1490, 1700, 1920]`,
},
{
title: 'Conversion Funnel',
category: 'Combined Bar + Line',
description: 'Bars for stage counts with a line showing conversion rate.',
source: `xychart-beta
title "Funnel Analysis"
x-axis [Visitors, Leads, Signups, Activated, Engaged, Paid, Retained]
bar [10000, 5500, 3000, 1800, 1200, 800, 500]
line [10000, 5500, 3000, 1800, 1200, 800, 500]`,
},
// ══════════════════════════════════════════════════════════════════════════
// AXIS CONFIGURATIONS
// ══════════════════════════════════════════════════════════════════════════
{
title: 'Categorical X-Axis',
category: 'Axis Configurations',
description: 'Standard categorical x-axis with string labels.',
source: `xychart-beta
title "Fruit Preferences"
x-axis [Apple, Banana, Cherry, Date, Elderberry]
bar [45, 32, 28, 15, 8]`,
},
{
title: 'Numeric X-Axis Range',
category: 'Axis Configurations',
description: 'Numeric x-axis using the range syntax.',
source: `xychart-beta
title "Distribution Curve"
x-axis 0 --> 100
line [4, 7, 13, 21, 31, 43, 58, 71, 84, 91, 95, 91, 84, 71, 58, 43, 31, 21, 13, 7, 4]`,
},
{
title: 'Y-Axis with Label and Range',
category: 'Axis Configurations',
description: 'Y-axis with a title and explicit min/max range.',
source: `xychart-beta
title "Temperature Log"
x-axis [6am, 8am, 10am, 12pm, 2pm, 4pm, 6pm, 8pm]
y-axis "Temp (F)" 50 --> 100
line [55, 60, 70, 80, 85, 80, 72, 62]`,
},
{
title: 'Y-Axis Range Without Label',
category: 'Axis Configurations',
description: 'Y-axis with range but no title.',
source: `xychart-beta
title "Sensor Readings"
x-axis [T1, T2, T3, T4, T5, T6, T7, T8]
y-axis 0 --> 500
line [120, 180, 270, 360, 380, 340, 260, 190]`,
},
{
title: 'X-Axis with Title',
category: 'Axis Configurations',
description: 'Categorical x-axis with an axis title.',
source: `xychart-beta
title "Quarterly Results"
x-axis "Quarter" [Q1, Q2, Q3, Q4]
y-axis "Revenue ($K)" 0 --> 1000
bar [420, 580, 710, 890]`,
},
{
title: 'Both Axes Titled',
category: 'Axis Configurations',
description: 'Both x-axis and y-axis have descriptive titles.',
source: `xychart-beta
title "Experiment Results"
x-axis "Trial Number" [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]
y-axis "Measurement (mm)" 0 --> 50
line [12, 15, 19, 24, 22, 26, 30, 28, 32, 35]`,
},
{
title: 'Long Category Labels',
category: 'Axis Configurations',
description: 'X-axis with long multi-word category labels.',
source: `xychart-beta
title "Department Budget"
x-axis [Engineering, Product Management, Customer Success, Human Resources]
bar [850, 420, 310, 180]`,
},
{
title: 'Many Short Labels',
category: 'Axis Configurations',
description: 'X-axis with many single-character labels.',
source: `xychart-beta
title "Letter Frequency"
x-axis [A, B, C, D, E, F, G, H, I, J, K, L, M]
bar [82, 15, 28, 43, 127, 22, 20, 61, 70, 2, 8, 40, 24]`,
},
{
title: 'Wide Y-Axis Range',
category: 'Axis Configurations',
description: 'Y-axis spanning a large range from 0 to 100000.',
source: `xychart-beta
title "Annual Revenue"
x-axis [2020, 2021, 2022, 2023, 2024]
y-axis "USD" 0 --> 100000
bar [15000, 28000, 45000, 67000, 92000]`,
},
{
title: 'Narrow Y-Axis Range',
category: 'Axis Configurations',
description: 'Y-axis with a tight range to emphasize small differences.',
source: `xychart-beta
title "CPU Temperature"
x-axis [10s, 20s, 30s, 40s, 50s, 60s]
y-axis "Celsius" 60 --> 80
line [65, 68, 72, 75, 73, 70]`,
},
{
title: 'Auto-Range Y-Axis',
category: 'Axis Configurations',
description: 'No y-axis declaration; auto-ranged from data.',
source: `xychart-beta
title "Auto Range"
x-axis [A, B, C, D, E]
bar [42, 87, 63, 29, 75]`,
},
{
title: 'Year Labels',
category: 'Axis Configurations',
description: 'X-axis with year labels as categories.',
source: `xychart-beta
title "Company Growth"
x-axis [2018, 2019, 2020, 2021, 2022, 2023, 2024, 2025]
line [10, 15, 12, 22, 35, 48, 62, 80]`,
},
{
title: 'Percentage Y-Axis',
category: 'Axis Configurations',
description: 'Y-axis configured as percentage from 0 to 100.',
source: `xychart-beta
title "Completion Rate"
x-axis [W1, W2, W3, W4, W5, W6, W7, W8]
y-axis "Percent" 0 --> 100
line [5, 12, 28, 50, 72, 85, 93, 97]`,
},
{
title: 'Numeric X-Axis with Bars',
category: 'Axis Configurations',
description: 'Numeric x-axis range combined with bar data.',
source: `xychart-beta
title "Histogram"
x-axis 0 --> 50
bar [5, 12, 25, 38, 30, 18, 8]`,
},
{
title: 'Mixed Short and Long Labels',
category: 'Axis Configurations',
description: 'X-axis with a mix of short and longer labels.',
source: `xychart-beta
title "Regional Sales"
x-axis [US, EU, Asia Pacific, LATAM, MEA, ANZ]
bar [450, 380, 520, 180, 95, 60]`,
},
// ══════════════════════════════════════════════════════════════════════════
// HORIZONTAL ORIENTATION
// ══════════════════════════════════════════════════════════════════════════
{
title: 'Horizontal Bar Chart',
category: 'Horizontal Orientation',
description: 'Simple horizontal bar chart.',
source: `xychart-beta horizontal
title "Language Popularity"
x-axis [Python, JavaScript, Java, Go, Rust]
bar [30, 25, 20, 12, 8]`,
},
{
title: 'Horizontal with Y-Axis',
category: 'Horizontal Orientation',
description: 'Horizontal bars with explicit y-axis range.',
source: `xychart-beta horizontal
title "Sprint Velocity"
x-axis [Sprint 1, Sprint 2, Sprint 3, Sprint 4, Sprint 5]
y-axis "Story Points" 0 --> 100
bar [45, 52, 68, 72, 80]`,
},
{
title: 'Horizontal Line Chart',
category: 'Horizontal Orientation',
description: 'Line chart in horizontal orientation.',
source: `xychart-beta horizontal
title "Response Time Trend"
x-axis [v1.0, v1.1, v1.2, v1.3, v1.4, v1.5, v1.6, v1.7]
line [450, 410, 370, 330, 290, 260, 235, 210]`,
},
{
title: 'Horizontal Combined',
category: 'Horizontal Orientation',
description: 'Horizontal chart with both bars and a line.',
source: `xychart-beta horizontal
title "Budget vs Actual"
x-axis [Eng, Sales, Marketing, Product, Ops, HR, Finance, Legal]
bar [500, 350, 250, 200, 150, 120, 100, 80]
line [480, 380, 230, 180, 160, 110, 95, 75]`,
},
{
title: 'Horizontal Ranking',
category: 'Horizontal Orientation',
description: 'Horizontal bars showing a ranked list.',
source: `xychart-beta horizontal
title "Top Features Requested"
x-axis [Dark Mode, API Access, Mobile App, SSO, Webhooks, CSV Export]
bar [245, 198, 176, 152, 134, 112]`,
},
{
title: 'Horizontal Small Values',
category: 'Horizontal Orientation',
description: 'Horizontal bars with small single-digit values.',
source: `xychart-beta horizontal
title "Team Satisfaction Survey"
x-axis [Culture, Compensation, Growth, Balance, Tools]
y-axis "Rating" 0 --> 5
bar [4, 3, 4, 5, 3]`,
},
{
title: 'Horizontal Two Bars',
category: 'Horizontal Orientation',
description: 'Horizontal chart with two bar series.',
source: `xychart-beta horizontal
title "This Year vs Last Year"
x-axis [Q1, Q2, Q3, Q4]
bar [200, 250, 300, 280]
bar [180, 220, 270, 310]`,
},
{
title: 'Horizontal Wide Range',
category: 'Horizontal Orientation',
description: 'Horizontal bars with a wide value range.',
source: `xychart-beta horizontal
title "GitHub Stars"
x-axis [React, Vue, Angular, Svelte, Solid]
bar [220000, 210000, 95000, 78000, 32000]`,
},
{
title: 'Horizontal with Two Lines',
category: 'Horizontal Orientation',
description: 'Horizontal chart with two line series.',
source: `xychart-beta horizontal
title "Planned vs Actual Delivery"
x-axis [F1, F2, F3, F4, F5, F6, F7, F8]
line [10, 12, 15, 17, 20, 22, 24, 25]
line [12, 13, 14, 18, 22, 21, 23, 24]`,
},
{
title: 'Horizontal Long Labels',
category: 'Horizontal Orientation',
description: 'Horizontal orientation with long category labels.',
source: `xychart-beta horizontal
title "Error Categories"
x-axis [Authentication Failure, Database Timeout, Rate Limit Exceeded, Invalid Input]
bar [342, 128, 89, 456]`,
},
// ══════════════════════════════════════════════════════════════════════════
// TITLES & FORMATTING
// ══════════════════════════════════════════════════════════════════════════
{
title: 'No Title',
category: 'Titles & Formatting',
description: 'Chart without a title declaration.',
source: `xychart-beta
x-axis [A, B, C, D]
bar [10, 20, 30, 40]`,
},
{
title: 'Short Title',
category: 'Titles & Formatting',
description: 'Chart with a very short one-word title.',
source: `xychart-beta
title "Sales"
x-axis [Jan, Feb, Mar]
bar [100, 200, 150]`,
},
{
title: 'Long Title',
category: 'Titles & Formatting',
description: 'Chart with a long descriptive title.',
source: `xychart-beta
title "Quarterly Revenue Comparison Across All Regional Offices 2024"
x-axis [Q1, Q2, Q3, Q4]
bar [1200, 1500, 1800, 2100]`,
},
{
title: 'Title with Numbers',
category: 'Titles & Formatting',
description: 'Title containing numeric values.',
source: `xychart-beta
title "FY2024 Q3 Results"
x-axis [Product A, Product B, Product C]
bar [340, 520, 180]`,
},
{
title: 'Title with Special Characters',
category: 'Titles & Formatting',
description: 'Title containing parentheses and symbols.',
source: `xychart-beta
title "Growth Rate (%)"
x-axis [2020, 2021, 2022, 2023]
line [5, 12, 8, 15]`,
},
{
title: 'Title with Ampersand',
category: 'Titles & Formatting',
description: 'Title using the ampersand character.',
source: `xychart-beta
title "R&D Investment"
x-axis [2021, 2022, 2023, 2024]
bar [200, 280, 350, 420]`,
},
{
title: 'Title with Hyphen',
category: 'Titles & Formatting',
description: 'Title containing hyphens.',
source: `xychart-beta
title "Year-Over-Year Comparison"
x-axis [Jan, Feb, Mar, Apr, May]
bar [100, 120, 90, 140, 130]
line [110, 115, 100, 125, 135]`,
},
{
title: 'Minimal Chart',
category: 'Titles & Formatting',
description: 'The most minimal possible xychart with just axis and data.',
source: `xychart-beta
x-axis [A, B]
bar [1, 2]`,
},
{
title: 'Full Specification',
category: 'Titles & Formatting',
description: 'Chart with every optional element specified.',
source: `xychart-beta
title "Complete Chart"
x-axis "Category" [Alpha, Beta, Gamma, Delta]
y-axis "Value" 0 --> 500
bar [120, 340, 250, 410]
line [120, 340, 250, 410]`,
},
{
title: 'Title with Colon',
category: 'Titles & Formatting',
description: 'Title containing a colon separator.',
source: `xychart-beta
title "Metrics: Daily Active Users"
x-axis [Mon, Tue, Wed, Thu, Fri]
line [1500, 1800, 2200, 2000, 1700]`,
},
// ══════════════════════════════════════════════════════════════════════════
// LARGE DATASETS
// ══════════════════════════════════════════════════════════════════════════
{
title: '12-Month Dataset',
category: 'Large Datasets',
description: 'Full year of monthly data points.',
source: `xychart-beta
title "Monthly Active Users (2024)"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct, Nov, Dec]
line [12000, 13500, 15200, 16800, 18500, 20100, 19800, 21500, 23000, 24200, 25800, 28000]`,
},
{
title: '26-Point Alphabet',
category: 'Large Datasets',
description: 'Bar chart with 26 data points, one per letter.',
source: `xychart-beta
title "Letter Distribution"
x-axis [A, B, C, D, E, F, G, H, I, J, K, L, M, N, O, P, Q, R, S, T, U, V, W, X, Y, Z]
bar [82, 15, 28, 43, 127, 22, 20, 61, 70, 2, 8, 40, 24, 67, 75, 19, 1, 60, 63, 91, 28, 10, 24, 2, 20, 1]`,
},
{
title: 'Dense Weekly Data',
category: 'Large Datasets',
description: 'Line chart with data for many weeks.',
source: `xychart-beta
title "Weekly Downloads"
x-axis [W1, W2, W3, W4, W5, W6, W7, W8, W9, W10, W11, W12, W13, W14, W15, W16, W17, W18, W19, W20]
line [500, 520, 480, 550, 600, 580, 620, 650, 700, 680, 720, 750, 800, 780, 820, 850, 900, 880, 920, 950]`,
},
{
title: 'Multiple Series Large',
category: 'Large Datasets',
description: 'Three data series across 12 months.',
source: `xychart-beta
title "Product Lines Revenue"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct, Nov, Dec]
bar [500, 520, 540, 580, 600, 620, 650, 640, 680, 700, 720, 750]
bar [300, 320, 310, 350, 370, 380, 400, 390, 420, 440, 450, 470]
line [800, 840, 850, 930, 970, 1000, 1050, 1030, 1100, 1140, 1170, 1220]`,
},
{
title: 'Two Bars Twelve Months',
category: 'Large Datasets',
description: 'Two bar series over 12 months for year comparison.',
source: `xychart-beta
title "2023 vs 2024 Monthly Sales"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct, Nov, Dec]
bar [180, 200, 220, 240, 260, 250, 270, 290, 310, 330, 350, 380]
bar [210, 230, 250, 270, 300, 290, 310, 330, 360, 380, 400, 430]`,
},
{
title: 'High Frequency Data',
category: 'Large Datasets',
description: 'Hourly data points across a full day.',
source: `xychart-beta
title "Hourly Server Load"
x-axis [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 21, 22, 23]
line [15, 12, 10, 8, 7, 9, 18, 45, 72, 85, 88, 90, 82, 78, 80, 85, 88, 75, 60, 45, 35, 28, 22, 18]`,
},
{
title: 'Large Values Dataset',
category: 'Large Datasets',
description: 'Dataset with values in the millions.',
source: `xychart-beta
title "Cloud Spending by Month"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct, Nov, Dec]
y-axis "USD" 0 --> 500000
bar [120000, 135000, 148000, 162000, 178000, 195000, 210000, 228000, 245000, 268000, 290000, 315000]`,
},
{
title: 'Three Lines Large',
category: 'Large Datasets',
description: 'Three overlapping line series over 10 data points.',
source: `xychart-beta
title "Multi-Region Latency"
x-axis [T1, T2, T3, T4, T5, T6, T7, T8, T9, T10]
line [45, 48, 42, 50, 55, 52, 47, 44, 49, 46]
line [120, 115, 125, 118, 122, 130, 128, 135, 132, 127]
line [200, 210, 195, 205, 215, 220, 208, 212, 218, 225]`,
},
{
title: 'Quarterly Four Years',
category: 'Large Datasets',
description: 'Quarterly data spanning four years.',
source: `xychart-beta
title "Quarterly Earnings (2021-2024)"
x-axis [21Q1, 21Q2, 21Q3, 21Q4, 22Q1, 22Q2, 22Q3, 22Q4, 23Q1, 23Q2, 23Q3, 23Q4, 24Q1, 24Q2, 24Q3, 24Q4]
bar [120, 140, 135, 160, 155, 175, 170, 190, 185, 210, 205, 230, 225, 250, 245, 270]`,
},
{
title: 'Dense Bars and Line',
category: 'Large Datasets',
description: 'Dense bar chart with 15 categories and an overlay line.',
source: `xychart-beta
title "Daily Active Users (First 15 Days)"
x-axis [D1, D2, D3, D4, D5, D6, D7, D8, D9, D10, D11, D12, D13, D14, D15]
bar [500, 520, 510, 530, 540, 480, 450, 520, 550, 540, 560, 570, 510, 490, 530]
line [500, 510, 510, 520, 530, 520, 510, 515, 525, 530, 535, 540, 535, 530, 530]`,
},
// ══════════════════════════════════════════════════════════════════════════
// EDGE CASES
// ══════════════════════════════════════════════════════════════════════════
{
title: 'Single Data Point',
category: 'Edge Cases',
description: 'Chart with only one data point.',
source: `xychart-beta
title "Single Value"
x-axis [Only]
bar [42]`,
},
{
title: 'All Zeros',
category: 'Edge Cases',
description: 'Bar chart where every value is zero.',
source: `xychart-beta
title "No Activity"
x-axis [Mon, Tue, Wed, Thu, Fri]
bar [0, 0, 0, 0, 0]`,
},
{
title: 'Very Large Numbers',
category: 'Edge Cases',
description: 'Chart with values in the millions.',
source: `xychart-beta
title "National GDP (millions)"
x-axis [Country A, Country B, Country C]
bar [5200000, 3800000, 2900000]`,
},
{
title: 'Very Small Numbers',
category: 'Edge Cases',
description: 'Chart with very small decimal-like integer values.',
source: `xychart-beta
title "Trace Amounts"
x-axis [Sample A, Sample B, Sample C, Sample D]
bar [1, 2, 1, 3]`,
},
{
title: 'Two Data Points',
category: 'Edge Cases',
description: 'Minimal chart with exactly two data points.',
source: `xychart-beta
title "Before and After"
x-axis [Before, After]
bar [25, 75]`,
},
{
title: 'Single Value Repeated',
category: 'Edge Cases',
description: 'All bars have the identical value.',
source: `xychart-beta
title "Equal Distribution"
x-axis [A, B, C, D, E]
bar [50, 50, 50, 50, 50]`,
},
{
title: 'Extreme Outlier',
category: 'Edge Cases',
description: 'One value is dramatically larger than the rest.',
source: `xychart-beta
title "Revenue by Product"
x-axis [Niche A, Niche B, Flagship, Niche C, Niche D]
bar [50, 30, 5000, 40, 20]`,
},
{
title: 'Descending to Zero',
category: 'Edge Cases',
description: 'Values that decrease to zero.',
source: `xychart-beta
title "Declining Interest"
x-axis [W1, W2, W3, W4, W5, W6, W7, W8]
line [100, 78, 55, 35, 20, 10, 4, 0]`,
},
{
title: 'Ascending from Zero',
category: 'Edge Cases',
description: 'Values that start at zero and increase.',
source: `xychart-beta
title "Ramp Up"
x-axis [Day 1, Day 2, Day 3, Day 4, Day 5]
bar [0, 10, 50, 150, 400]`,
},
{
title: 'Alternating High Low',
category: 'Edge Cases',
description: 'Values alternating between high and low.',
source: `xychart-beta
title "Alternating Pattern"
x-axis [A, B, C, D, E, F, G, H]
bar [100, 10, 100, 10, 100, 10, 100, 10]`,
},
// ══════════════════════════════════════════════════════════════════════════
// REAL-WORLD SCENARIOS
// ══════════════════════════════════════════════════════════════════════════
{
title: 'Monthly Revenue Report',
category: 'Real-World Scenarios',
description: 'Typical monthly revenue bar chart for a SaaS company.',
source: `xychart-beta
title "Monthly Revenue (2024)"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct, Nov, Dec]
y-axis "Revenue ($K)" 0 --> 500
bar [180, 195, 210, 225, 250, 268, 285, 275, 300, 320, 340, 380]`,
},
{
title: 'Cumulative Registered Users',
category: 'Real-World Scenarios',
description: 'Cumulative user growth over months showing accelerating adoption.',
source: `xychart-beta
title "Cumulative Registered Users"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct, Nov, Dec]
y-axis "Users" 0 --> 50000
line [2500, 5200, 8800, 13100, 18000, 23500, 29200, 34800, 39500, 43200, 46500, 50000]`,
},
{
title: 'Temperature Over the Year',
category: 'Real-World Scenarios',
description: 'Average monthly temperature showing seasonal variation.',
source: `xychart-beta
title "Average Monthly Temperature"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct, Nov, Dec]
y-axis "Temp (F)" 20 --> 100
line [32, 35, 45, 58, 68, 78, 85, 83, 74, 60, 48, 36]`,
},
{
title: 'Stock Price Trend',
category: 'Real-World Scenarios',
description: 'Weekly stock price movement over a quarter.',
source: `xychart-beta
title "ACME Corp Stock Price"
x-axis [W1, W2, W3, W4, W5, W6, W7, W8, W9, W10, W11, W12, W13]
y-axis "Price ($)" 80 --> 160
line [100, 105, 98, 112, 108, 120, 115, 125, 135, 128, 140, 148, 155]`,
},
{
title: 'Survey Results',
category: 'Real-World Scenarios',
description: 'Customer satisfaction survey scores by category.',
source: `xychart-beta
title "Customer Satisfaction Survey"
x-axis [Ease of Use, Performance, Support, Pricing, Features, Reliability]
y-axis "Score" 0 --> 5
bar [4, 3, 5, 3, 4, 4]`,
},
{
title: 'API Response Time',
category: 'Real-World Scenarios',
description: 'P95 API response times across endpoints.',
source: `xychart-beta
title "P95 Response Time by Endpoint"
x-axis [/users, /orders, /products, /search, /auth, /reports]
y-axis "ms" 0 --> 1000
bar [120, 250, 180, 450, 80, 850]`,
},
{
title: 'Website Analytics',
category: 'Real-World Scenarios',
description: 'Daily page views and unique visitors for a week.',
source: `xychart-beta
title "Website Traffic"
x-axis [Mon, Tue, Wed, Thu, Fri, Sat, Sun]
bar [8500, 9200, 9800, 9500, 8800, 5200, 4100]
line [3200, 3500, 3800, 3600, 3400, 2100, 1800]`,
},
{
title: 'Sprint Burndown',
category: 'Real-World Scenarios',
description: 'Remaining story points over a two-week sprint.',
source: `xychart-beta
title "Sprint Burndown"
x-axis [D1, D2, D3, D4, D5, D6, D7, D8, D9, D10]
y-axis "Story Points" 0 --> 80
line [72, 65, 58, 50, 45, 38, 30, 22, 12, 0]
line [72, 65, 58, 50, 43, 36, 29, 22, 14, 0]`,
},
{
title: 'Marketing Funnel',
category: 'Real-World Scenarios',
description: 'Marketing conversion funnel from impressions to purchases.',
source: `xychart-beta
title "Marketing Funnel"
x-axis [Impressions, Clicks, Signups, Trials, Purchases]
bar [50000, 5000, 1200, 400, 150]`,
},
{
title: 'Server Error Rates',
category: 'Real-World Scenarios',
description: 'HTTP error rates by hour during an incident.',
source: `xychart-beta
title "Error Rate During Incident"
x-axis [10am, 11am, 12pm, 1pm, 2pm, 3pm, 4pm, 5pm]
y-axis "Errors/min" 0 --> 500
bar [5, 12, 45, 380, 420, 250, 35, 8]
line [5, 12, 45, 380, 420, 250, 35, 8]`,
},
{
title: 'Employee Growth',
category: 'Real-World Scenarios',
description: 'Headcount growth at a startup over years.',
source: `xychart-beta
title "Company Headcount"
x-axis [2018, 2019, 2020, 2021, 2022, 2023, 2024]
bar [8, 15, 25, 45, 80, 120, 185]`,
},
{
title: 'Monthly Churn Rate',
category: 'Real-World Scenarios',
description: 'Customer churn rate percentage over months.',
source: `xychart-beta
title "Monthly Churn Rate"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct, Nov, Dec]
y-axis "Churn %" 0 --> 10
line [5, 4, 5, 4, 3, 3, 4, 3, 3, 2, 2, 2]`,
},
{
title: 'A/B Test Results',
category: 'Real-World Scenarios',
description: 'Conversion rates for control vs variant across segments.',
source: `xychart-beta
title "A/B Test Conversion Rates"
x-axis [Mobile, Desktop, Tablet, New Users, Returning]
bar [3, 5, 4, 2, 6]
bar [4, 7, 5, 3, 8]`,
},
{
title: 'Cloud Cost Breakdown',
category: 'Real-World Scenarios',
description: 'Monthly cloud infrastructure costs by service.',
source: `xychart-beta
title "Monthly Cloud Costs"
x-axis [Compute, Storage, Database, Network, CDN, Monitoring, Other]
y-axis "USD" 0 --> 20000
bar [15000, 8000, 6500, 3200, 2800, 1500, 900]`,
},
{
title: 'Release Frequency',
category: 'Real-World Scenarios',
description: 'Number of production deployments per month.',
source: `xychart-beta
title "Production Deployments per Month"
x-axis [Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct, Nov, Dec]
bar [12, 15, 18, 22, 20, 25, 28, 24, 30, 32, 35, 38]
line [12, 15, 18, 22, 20, 25, 28, 24, 30, 32, 35, 38]`,
},
]
在新工单中引用 查看 Git Blame 复制永久链接