Skip to content

load

Loads data from a filepath or URL, converts it to a valid JSON object, and returns it to a callback function.

Fetches a URL, parses it by extension (.json, .csv, .tsv, or .txt), and passes the rows to the callback. This is what runs behind a chart’s data: "…" config; called directly it only needs an object for this.

import {load} from "@d3plus/data";

load.call({}, "/data/city_coords.json", undefined, undefined, (error, rows) => {
  // rows is the parsed JSON array
});

CSV cells arrive as strings, so every value that parses as a number becomes a number and "true"/"false" become booleans before the rows are handed over. Here sweet and calories come back typed.

import {load} from "@d3plus/data";

load.call({}, "/data/fruits.csv", undefined, undefined, (error, rows) => {
  // rows[0] → {name: "Apple", color: "red", sweet: true, calories: 95}
});

An array can mix URLs and inline arrays. Everything that needs fetching is loaded, then the pieces are concatenated in the order given, so the inline Durian row lands after the five fetched fruits.

import {load} from "@d3plus/data";

load.call(
  {},
  [
    "/data/fruits.csv",
    [{name: "Durian", color: "green", sweet: true, calories: 147}],
  ],
  undefined,
  undefined,
  (error, rows) => {
    // the fetched rows followed by the inline row
  },
);

Parameters

import {load} from "@d3plus/data";
thisrequiredVizContext
pathrequiredstring | Array.<DataPoint> | Array.<string | Array.<DataPoint> | LoadRequestConfig>

The path to the file or url to be loaded. Also support array of paths strings. If an Array of objects is passed, the xhr request logic is skipped.

formatterDataFormatter

Optional function to transform the loaded data.

keystring

The key in the this context to save the resulting data to.

callbackFunction

Optional function called with the error and loaded data. Without one, a failed request is logged to the console.