Integrate with the Javascript Library

Use the Universal Data Tool in any javascript application using a <script /> import tage.

Quick Start: UDT in Static HTML Page

https://codesandbox.io/s/universal-data-tool-in-any-web-page-s8mh6codesandbox.io

Installation

Put a script tag at the top of your page importing the Universal Data Tool "vanilla" library.

The vanilla library bundles all the Universal Data Tool dependencies together into a single file, making it easy to use anywhere!

<script
    type="application/javascript"
    src="https://unpkg.com/universal-data-tool@0.13.2/vanilla.js"
></script>

Usage

Add a container element to your body. Then call window.UniversalDataTool.open to open the UDT in your element.

<body>
  <div id="udt"></div>
  <script type="application/javascript">
    window.UniversalDataTool.open({
      container: document.getElementById("udt"),

      // Your UDT dataset
      // https://github.com/UniversalDataTool/udt-format
      udt: {
        interface: {
          type: "image_classification",
          labels: ["A", "B"]
        },
        samples: [
          {
            imageUrl: "https://placekitten.com/408/287"
          }
        ]
      },

      // Called when sample is saved
      onSaveSample: (index, sample) => {
        console.log(index, sample);
      }
    });
  </script>
</body>

PreviousFast.ai Image Segmentation NextGetting Started with React

Last updated 5 years ago

<body>
  <div id="udt"></div>
  <script type="application/javascript">
    window.UniversalDataTool.open({
      container: document.getElementById("udt"),

      // Your UDT dataset
      // https://github.com/UniversalDataTool/udt-format
      udt: {
        interface: {
          type: "image_classification",
          labels: ["A", "B"]
        },
        samples: [
          {
            imageUrl: "https://placekitten.com/408/287"
          }
        ]
      },

      // Called when sample is saved
      onSaveSample: (index, sample) => {
        console.log(index, sample);
      }
    });
  </script>
</body>