#
Embed the Dataset Viewer in a webpage

You can embed the Dataset Viewer in your own webpage using an iframe.

The URL to use is `https://huggingface.co/datasets/<namespace>/<dataset-name>/embed/viewer`, where `<namespace>` is the owner of the dataset (user or organization) and `<dataset-name>` is the name of the dataset. You can also pass other parameters like the subset, split, filter, search or selected row.

For example, the following iframe embeds the Dataset Viewer for the `glue` dataset from the `nyu-mll` organization:

    <iframe
      src="https://huggingface.co/datasets/nyu-mll/glue/embed/viewer"
      frameborder="0"
      width="100%"
      height="560px"
    ></iframe>

You can also get the embed code directly from the Dataset Viewer interface. Click on the `Embed` button in the top right corner of the Dataset Viewer:

It will open a modal with the iframe code that you can copy and paste into your webpage:

##
Parameters

All the parameters of the dataset viewer page can also be passed to the embedded viewer (filter, search, specific split, etc.) by adding them to the iframe URL. For example, to show the results of the search on `mangrove` in the `test` split of the `rte` subset of the `nyu-mll/glue` dataset, you can use the following URL:

    <iframe
      src="https://huggingface.co/datasets/nyu-mll/glue/embed/viewer/rte/split?search=mangrove"
      frameborder="0"
      width="100%"
      height="560px"
    ></iframe>

You can get this code directly from the Dataset Viewer interface by performing the search, clicking on the `⋮` button then `Embed`:

It will open a modal with the iframe code that you can copy and paste into your webpage:

##
Examples

The embedded dataset viewer is used in multiple Machine Learning tools and platforms to display datasets. Here are a few examples.

Open a pull request if you want to appear in this section!

###
Tool: ZenML

`htahir1` shares a blog post showing how you can use the ZenML integration with the Datasets Viewer to visualize a Hugging Face dataset within a ZenML pipeline.

###
Tool: Metaflow + Outerbounds

`eddie-OB` shows in a demo video how to include the dataset viewer in Metaflow cards on Outerbounds.

###
Tool: AutoTrain

`abhishek` showcases how the dataset viewer is integrated into AutoTrain in a demo video.

###
Datasets: Alpaca-style datasets gallery

`davanstrien` showcases the collection of Alpaca-style datasets in a space.

###
App: Electric Vehicle Charge Finder

`cfahlgren1` embeds the dataset viewer in the Electric Vehicle Charge Finder app.

###
Datasets: Docmatix

`andito` uses the embedded viewer in the blog post announcing the release of Docmatix, a huge dataset for Document Visual Question Answering (DocVQA).

< > Update on GitHub