CSV format

framechart accepts standard UTF-8 CSV files. The first row must be a header. Values can be quoted or unquoted; commas are the only supported delimiter.

Long format vs wide format

framechart auto-detects which shape your CSV is in. You can override the detection with the Data Mapping group in the Inspector.

Long format (recommended for races)

One row per (time × entity) pair. Easy to add new time steps.

Year,Country,GDP
2010,United States,15049
2010,China,6101
2010,Germany,3310
2015,United States,18206
2015,China,11016
2015,Germany,3355

Wide format

One row per entity; time steps are column headers. Common in Excel exports.

Country,2010,2015,2020,2023
United States,15049,18206,21354,27357
China,6101,11016,15103,17795
Germany,3310,3355,3937,4456

Both shapes work for Bar Race and Line Race. framechart reads the shape and normalises to long format internally. If detection goes wrong, use the Data Mapping pickers to explicitly assign each column role.

Line chart format

Long format: an X column (time or category), a Y column (numeric), and an optional series column (entity names for multi-line charts).

Date,Company,Revenue
2020-Q1,Apple,58313
2020-Q1,Microsoft,35021
2020-Q2,Apple,59685
2020-Q2,Microsoft,38033

Wide format also works: each numeric column becomes one line. The first column is treated as the X axis; every other column is a separate series.

Table format

Any tabular CSV. Column headers become the table header row. Every column is displayed by default; use the Columns group in the Inspector to hide individual ones.

Rank,Country,GDP (T USD),Growth
1,United States,27.4,2.5%
2,China,17.8,5.2%
3,Germany,4.5,0.1%

Numeric detection

A column is treated as numeric if every non-header cell parses as a floating-point number (after stripping leading/trailing whitespace, optional commas as thousands separators, and an optional leading $ or trailing %).

  • 27357 → numeric
  • 27,357 → numeric (thousands separator stripped)
  • $27,357 → numeric
  • 2.5% → numeric (% stripped, value 2.5)
  • United States → text

Date / time columns

When the X axis mode is set to Auto or Time, framechart tries to parse the X column values as dates. Supported formats:

  • 2024 — year integer
  • 2024-03 — year-month
  • 2024-03-15 — ISO 8601 date
  • 2024-Q1 — year + quarter

Parsed dates control proportional spacing on the X axis. If parsing fails, framechart falls back to categorical (evenly-spaced) layout.

Data mapping overrides

Auto-detection is a heuristic: it picks the first text column as the category and the last numeric column as the value, for example. When your CSV has a different structure, use the Data Mapping group in the Inspector to explicitly assign each column to its role (Category, Value, X, Y, Series, Time). Option 0 in every picker is Auto — switch back to it to re-enable heuristics.