Using Loaders
loaders.gl has parser functions that use so called "loaders" to convert the raw data loaded from files into parsed objects. Each loader encapsulates a parsing function for one file format (or a group of related file formats) together with some metadata (like the loader name, common file extensions for the format etc).
Installing loaders
loaders.gl provides a suite of pre-built loader objects packaged as scoped npm modules. The intention is that applications will install and import loaders only for the formats they need.
Using Loaders
Loaders are passed into utility functions in the loaders.gl core API to enable parsing of the chosen format.
import {load} from '@loaders.gl/core';
import {CSVLoader} from '@loaders.gl/csv';
data = await load(url, CSVLoader);
// Application code here
...
Specifying Loaders
As seen above can be specified directly in a call to load
or any of the parse
functions:
import {load} from '@loaders.gl/core';
import {PCDLoader} from '@loaders.gl/pcd';
import {LASLoader} from '@loaders.gl/las';
const pointCloud = await load(url, [PCDLoader, LASLoader]);
// Application code here
...
Loaders and TypeScript
Since v4.0, all loaders are typed, meaning that loaders.gl can infer types for returned data and loader options from the supplied loader
Note that type inference only works when single loader is provided:
import {load} from '@loaders.gl/core';
import {PCDLoader} from '@loaders.gl/pcd';
import {LASLoader} from '@loaders.gl/las';
// Single loader infers type
const pcdPointCloud = await load(url, PCDLoader); // => type PCDMesh
const lasPointCloud = await load(url, LASLoader); // => type LASMesh
const pointCloud = await load(url, [PCDLoader, LASLoader]); // => type unknown
Note that you can use selectLoader and a switch statement to remain typed
import {load} from '@loaders.gl/core';
import {PCDLoader} from '@loaders.gl/pcd';
import {LASLoader} from '@loaders.gl/las';
const loader = await selectLoader(url, [PCDLoader, LASLoader]);
switch (loader.id) {
case: 'pcd':
const pcdPointCloud = await load(url, PCDLoader); // => type PCDMesh
break;
case 'las':
const lasPointCloud = await load(url, LASLoader); // => type LASMesh
break;
}