# Data displays

# datasetBrowser

datasetBrowser(dataset: Dataset<InputType, string>): DatasetBrowser;

A Dataset browser provides an interface to visualize the contents of a dataset. It takes a dataset as argument, assuming that each instance contains a thumbnail property that can be displayed as an image (typically, a base64 dataURI).

# Parameters

Option Type Description Required
dataset Dataset The dataset to visualize

# Screenshot

Screenshot of the datasetBrowser component

# Example

const trainingSetBrowser = marcelle.datasetBrowser(trainingSet);
dashboard.page('Data Management').use(trainingSetBrowser);

# datasetTable

datasetTable(
  dataset: Dataset,
  columns?: string[],
): DatasetTable

This components provides a visualization of a dataset as a paginated data table, where each row describes an instance. It takes a dataset as argument, and optionally the list of columns to display.

# Parameters

Option Type Description Required
dataset Dataset The dataset to visualize
columns string[] The fields to display as columns in the visualization. Defaults to ['x', 'y', 'thumbnail', 'updatedAt'].

# Screenshot

Screenshot of the datasetTable component

# Example

const tst = marcelle.datasetTable(trainingSet);
dashboard.page('Data Management').use(tst);

# imageDisplay

marcelle.imageDisplay(
  imageStream: Stream<ImageData> | Stream<ImageData[]>
): DatasetBrowser;

An Image Display allows for displaying an image on screen provided by an input stream.

# Parameters

Option Type Description Required
imageStream Stream<ImageData> | Stream<ImageData[]> Stream of images of ImageData (opens new window) format

# Example

const source = imageUpload({ width: 224, height: 224 });
const instanceViewer = marcelle.imageDisplay(source.$images);
dashboard.page('Data').use(instanceViewer);