CSV to Timeline

Point at a date column and every row becomes a bar on a real time axis, running from its start to its end or sitting as a short marker when there is no end. A second column splits the events into colored lanes. Dates that will not parse are skipped and reported by name. It all happens in your browser.

Want something to try it on? Use the sample project tracker · date start_date, lane project, end date due_date.

Need to clean the dates first? Open the app

Time on the axis, not categories pretending to be time

The single decision that makes this page worth using is that the horizontal axis is genuinely temporal. Every bar is positioned by its timestamp, so the distance between two events on screen is the distance between them in the calendar. A quiet November leaves a visible gap. A week where nine things all started leaves a cluster. That rhythm is the reason anyone draws a timeline instead of listing rows.

The alternative is depressingly common. A tool takes your date column, treats each distinct value as a category, and lays them out evenly across the axis. The result looks like a timeline, labels like a timeline, and lies about pacing in every direction: three events a day apart and three events a year apart get identical spacing. You cannot tell by looking, which is precisely what makes it dangerous. If you have ever stared at a timeline that felt oddly uniform, that is usually what happened to it.

Being a real axis also means the picture rescales itself around your data. Drop a file covering three weeks and the ticks are days. Drop one covering four years and they are quarters. Nothing needs configuring, because the span is knowable from the parsed values and guessing wrong is not a risk worth taking with a reader's time.

Four controls

No aggregate here, and no top-N. A timeline draws rows, not groups, so there is nothing to sum and nothing to fold into an Other bucket. That makes it the simplest control panel on the site.

Date. The start of each event, and the only required control. ISO dates always parse; the common regional formats usually do; anything that fails is skipped rather than guessed at.
Lane. Optional, defaulting to One lane. Choosing a column turns each distinct value into a horizontal band with its own color. Project, team, owner, environment, release train. Blank values are gathered under a visible blank label so an unassigned item stays in view.
End date. Optional, defaulting to Point events. Give it a column and each bar stretches from its start to its end. Rows with a start but no readable end still appear as short markers, so a mixed file of milestones and tasks works without splitting it in two.
Size. Optional. Attaches a number to each event, carried into the tooltip and the export. It does not change any bar's length, because length already means duration and one visual channel cannot carry two meanings.

Worked example: a project tracker

The sample file is a task list with two date columns, which is exactly the shape a timeline wants:

task_id,project,assignee,status,priority,start_date,due_date,estimated_hours,logged_hours
T-200,Beacon,B. Osei,review,high,2024-03-09,2024-03-31,29,20
T-201,Beacon,D. Silva,done,urgent,2024-05-08,2024-05-24,16,14
T-202,Cedar,A. Rahman,in progress,high,2024-05-11,2024-05-31,17,29
T-203,Drift,F. Adeyemi,review,low,2024-01-18,2024-01-27,27,44
T-204,Drift,E. Novak,done,low,2024-05-17,2024-05-27,25,34

Set Date to start_date, Lane to project and End date to due_date. The panel titles itself start_date timeline, puts TIMELINE in the corner, and captions the picture with three counts in the shape 60 events · 3 lanes · 60 with an end date. Three colored bands appear, one each for Beacon, Cedar and Drift, with the bars inside them running from March to May and beyond.

That third clause is doing quiet work. It is the count of rows whose end is genuinely later than their start, so it tells you how much of your file has real durations in it. Swap End date back to Point events and the caption's last clause changes to the words point events, and the bars collapse to markers. Leave End date set but feed it a file where only a third of the rows have a due date, and the count says so. I have caught more than one broken export that way, where a project tool wrote due dates for closed tasks and nothing for open ones.

Now change Lane to assignee. The same bars redistribute into a band per person, and the shape of somebody's workload becomes visible in a way a status column never shows: three overlapping bars in the same fortnight is an overloaded fortnight, whatever the tickets claim. Change it to status and you get bands for done, in progress and review, which reads as a rough flow of the work through its states.

Set Size to estimated_hours and the number rides along in every tooltip and in the export, without changing a single bar. Then Download the events gives you four columns, lane, start, end and the measure, with both dates normalized to ISO. A messy tracker export arrives with slashes and inconsistent padding and leaves clean, which is worth the trip on its own.

When a date will not parse

Date columns are the messiest thing in the average CSV, so it is worth knowing exactly what happens to a value the parser cannot read. It is skipped. Not defaulted to today, not coerced to the epoch, not silently placed at the left edge of the axis where it would look like the earliest event in the file. The row simply does not appear, and because the caption counts what was drawn, a smaller number than you expected is a signal you can act on.

If nothing at all parses, the page refuses to draw an empty frame and tells you where to look instead: No parseable dates found in start_date. ISO dates (2024-03-15) always work. Two things are deliberate in that sentence. It names your column, so on a file with six date-ish columns you know which one it was reading. And it names a format that is guaranteed, rather than listing everything it tolerates, because when you are stuck you want one thing that definitely works and not a menu.

The most common real cause is ambiguity between day-first and month-first slash formats, where the first dozen rows happen to be readable both ways and the parser has to pick. The cure is boring and permanent: convert the column to ISO once, in the app or in whatever produced the file, and never think about it again. The end date column follows the same rules, except that a failure there is softer, because a row with a good start and a bad end still has a place to sit and becomes a marker.

Exports

Download the events. Lane, start, end and size, one row per drawn bar, in the order the timeline sorted them. Both dates are written as ISO, so the file is safe to load anywhere without a format argument.
Download PNG. Two-times density on the panel's own background. Timelines are wide by nature, so this is the export that most often ends up spanning a slide.
Download SVG. Vector paths and real text. Worth using for anything printed, because a timeline's value is in its fine horizontal detail and that is the first thing a scaled-up raster destroys.
Copy image. The PNG onto the clipboard, for pasting into a status update or a ticket without saving a file first.

To put the timeline on a page rather than in a document, the embed builder compresses the events and the settings into an iframe URL, so the chart renders from the link with no server holding anything.

What this page will not do

A timeline is not a project management tool, and being clear about that saves everyone time:

No dependency arrows. Nothing is drawn between bars. Real dependency chains need a predecessor column and a critical path calculation, which is a planning tool's job and not a chart's.
No editing by dragging. Bars are drawn from the file and cannot be moved. The picture is a view of your data, not a second copy of it that could drift out of sync.
No today marker or progress shading. A percent-complete overlay implies the file carries a reliable progress field, and most do not.
No overlap resolution inside a lane. Two events in the same lane covering the same fortnight are drawn on the same row. Split the lane by owner if you need every bar separately visible.
No filtering. Every parseable row is drawn. Filter first in the app, or trim the file with the CSV splitter.
A header row is required, and at least one column that reads as dates. Without a date column there is no axis to build.

Comma, semicolon, tab and pipe delimited files parse with no configuration, so a block of cells pasted from a spreadsheet works. Excel workbooks and JSON come in through excel-to-chart and json-to-chart.

Frequently Asked Questions

What does one row become on the timeline?

One bar. It starts at the value in the Date column and ends at the value in the End date column. If you have not chosen an End date column, or that particular row has no end value in it, the bar becomes a short marker sitting at the start date instead of stretching to nowhere. Rows are sorted by start date before drawing, so the picture reads left to right in the order things actually happened rather than in the order the file happened to store them.

Why are some of my rows missing?

A row whose Date column cannot be parsed as a date is skipped, because a bar with no position on the axis has nowhere to go. If nothing at all parses, the page stops and names the column it was reading along with the format that always works, in the form No parseable dates found in start_date. ISO dates (2024-03-15) always work. The usual culprits are day-first and month-first ambiguity in slash-separated dates, and a stray footer row at the bottom of an export.

Is the x axis a real time axis?

Yes, and this is the difference between a timeline and a bar chart wearing a costume. Positions are computed from actual timestamps, so a six-month gap between two events is six times the width of a one-month gap. Plenty of tools plot dates as evenly spaced categories, which makes a quiet period look identical to a busy one and hides exactly the rhythm you opened a timeline to see. Ticks are formatted for the span on screen and the whole axis rescales when the range of the data changes.

How do lanes work?

The Lane column is grouped, and each distinct value becomes a horizontal band with its own color from the categorical palette. Set it to a project, a team, an owner or a workstream. Leave it on One lane and every event is stacked into a single band called All, which is the right choice for a plain chronology such as a release history. Rows with a blank lane value are collected under a visible blank label rather than being dropped, because an unassigned item is usually the one worth noticing.

What is the caption under the title telling me?

Three counts: how many events were drawn, how many lanes they fell into, and how many of them carry a real end date. That last clause is the useful one, reading something like 42 with an end date, or the words point events when none do. It is a direct check on whether your End date column was actually populated, because a file where half the rows have an empty due date produces a timeline that looks sparse for a reason the picture alone cannot explain.

Does the Size control change the length of a bar?

No. Length is time and nothing else, since a bar that is long because it is important and a bar that is long because it lasted a while would be indistinguishable. Size attaches a number to each event and carries it into the tooltip and into the exported CSV, so estimated hours or budget or headcount travels with the row. Rows with no readable number in that column get zero rather than being skipped.

Is my file uploaded to make the timeline?

No. Dates are parsed, rows are sorted and bars are placed inside your browser tab. There is no server endpoint behind this page and nothing that carries your rows off the machine, which matters more than usual here because project files tend to carry names of real people in the assignee column. Close the tab and it is gone.

Can I export the events?

Yes. Download the events writes a CSV with four columns: lane, start, end and the size measure. Dates are normalized to ISO, so a file that arrived with slashes and inconsistent padding leaves clean, which alone is a reason to run a messy project export through this page. Point events show the same value for start and end. PNG, SVG and copy-to-clipboard exports of the picture are next to it.

Put your dates on a real axis

Drop the CSV, name a date column, see the pacing. No sign-up, no upload, no row cap.

Back to the timeline maker