Use your data

Some concepts in the gallery can redraw themselves with your own numbers: your step counts, your messages per hour, your weekly hours. Give a concept a small CSV or JSON file in one of six formats and it draws your data in place of its sample.

Your data never leaves your browser. The file is read on your device by the page's own script. Nothing is uploaded, stored or sent to any server, and closing the tab forgets it. The only time a page fetches anything is when you link it to a file with ?data=, and then only from this same website.

Four ways to load a file

The button

Concepts that accept data show a Use your data button in a corner. Choose a .csv, .tsv or .json file.

Drag and drop

Drop the file anywhere on the concept page.

A link

Add ?data= and a path to a file on this site, for example ?data=../import/samples/daily-synthetic.json. Links to other websites are refused.

From another page

A page on this same site can send data to a concept in an iframe with postMessage. See for developers.

A banner then says Showing your data, with a Reset to sample button to bring the original back. If the file has a problem, the banner names the line and column so you can fix it.

Concepts that take your data

Loading the list…

The six formats

Every format comes as JSON or as a table (CSV or TSV) with a header row. A few rules apply to all of them:

daily · one value per day

A single number for each day: steps, sales, earthquakes, words written. values[0] is the start date and each next value is the next day.

JSON
{
  "start": "2024-01-01",
  "values": [6200, 8104, null, 7450]
}
CSV (also as JSON rows)
date,value
2024-01-01,6200
2024-01-02,8104
2024-01-04,7450

The value column may also be called count, or be the only column besides date. Also accepted: a panel with exactly one series, or dayhour data (hours are summed into daily totals).

Samples Synthetic daily-synthetic.json daily-synthetic.csv

panel · several daily series

Several numbers per day that line up by date, such as steps, hours of sleep and cups of coffee. cols is accepted in place of series. Shorter series are padded with no data.

JSON
{
  "start": "2024-03-01",
  "series": {
    "steps":       [7012, 9480, 6650],
    "sleep_hours": [6.9, 8.1, null]
  }
}
CSV: a date column plus one column per series
date,steps,sleep_hours
2024-03-01,7012,6.9
2024-03-02,9480,8.1
2024-03-03,6650,

Also accepted: daily data, which becomes one series called value.

Samples Synthetic panel-synthetic.json panel-synthetic.csv

dayhour · every hour of every day

One row per day with 24 numbers, hour 0 (midnight) to hour 23. Good for messages sent, energy use or listening time.

JSON: 24 numbers per day
{
  "start": "2024-09-02",
  "hours": [
    [0,0,0,0,0,0,0,1,4,6,5,7,9,8,6,5,4,6,8,9,7,5,2,1],
    [0,0,0,0,0,0,1,2,5,7,6,6,8,9,7,6,5,5,7,8,6,4,3,1]
  ]
}
CSV: long format, one row per hour
date,hour,value
2024-09-02,0,0
2024-09-02,1,0
...
2024-09-03,23,1

Hours are 0 to 23 (07:00 also works). Missing hours show as no data.

Samples Synthetic dayhour-synthetic.json dayhour-synthetic.csv

weekhour · a typical week, hour by hour

A 7 × 24 grid: one row per weekday, Monday first, and one column per hour. Rows given in another order are put back in Monday-to-Sunday order.

JSON
{
  "rows": ["Mon","Tue","Wed","Thu","Fri","Sat","Sun"],
  "matrix": [
    [0.3, 0.2, ... 24 numbers],
    ... 7 rows
  ]
}
CSV
weekday,hour,value
Mon,0,0.3
Mon,1,0.2
...
Sun,23,1.1

Weekdays can be names (Mon, Monday) or ISO numbers, 1 = Monday to 7 = Sunday. Also accepted: dayhour data, averaged for each weekday and hour.

Samples Synthetic weekhour-synthetic.json weekhour-synthetic.csv

profile24 · hour-of-day profiles

One or more named curves of 24 numbers, hour 0 to 23: an average day, or weekdays against weekends.

JSON
{
  "series": {
    "weekdays": [0.4, 0.4, ... 24 numbers],
    "weekends": [0.6, 0.7, ... 24 numbers]
  }
}
CSV: an hour column plus one column per profile
hour,weekdays,weekends
0,0.42,0.65
1,0.47,0.71
...
23,0.55,0.93

Also accepted: dayhour or weekhour data, averaged into one profile called average.

Samples Synthetic profile24-synthetic.json profile24-synthetic.csv

weekly · one value per week

Weekly totals, dated by the first day of each week. Rows must be whole weeks apart; missing weeks show as no data.

JSON
{
  "shape": "weekly",
  "start": "2023-01-02",
  "values": [41, 38, 47, null, 52]
}
CSV
week,value
2023-01-02,41
2023-01-09,38
2023-01-16,47

ISO weeks such as 2023-W01 also work. Add "shape": "weekly" to the JSON form above; an unlabelled start + values object is daily data. Also accepted: daily data, summed into Monday-to-Sunday weeks (the banner notes partial first or last weeks).

Samples Synthetic weekly-synthetic.json weekly-synthetic.csv

The sample files are synthetic: made-up numbers that show the format. They are not real measurements of anyone.

Check a file

Test a file against a format before you open a concept. This runs in your browser too.

No file checked yet.

For developers

A page on the same site can hand data to a concept in an iframe. Messages from other origins are ignored.

frame.contentWindow.postMessage({
  type: "dp-import",
  shape: "daily",
  name: "My steps",
  data: { start: "2024-01-01", values: [6200, 8104, 7450] }
}, location.origin);

data can be any accepted JSON form, or CSV text as a string. The concept replies with { type: "dp-import-result", ok, error }. To make a concept accept data, see ADAPTERS.md.