Universal Data Tool
Search…
Building and Labeling Datasets
Importing Data
The Format .udt.json
Machine Learning
Integrate with Any Web Page
Train your Workforce
Getting Started with React
Use the Universal Data Tool in React Applications.
Quick Start: CodeSandbox Example
Example Loading Image Classification Interface
Installation
1
npm install universal-data-tool
Copied!
Usage
The
<UniversalDataViewer /> component has every interface baked in. Just provide a dataset in the dataset prop to view any dataset!1
import React from "react";
2
import UniversalSampleEditor from "universal-data-tool";
3
​
4
export default function App() {
5
return (
6
<div className="App">
7
<UniversalSampleEditor
8
// Read more about this format here:
9
// https://github.com/UniversalDataTool/udt-format
10
interface={{
11
type: "image_classification",
12
labels: ["cat", "dog"]
13
}}
14
sample={{
15
imageUrl: "https://placekitten.com/408/287"
16
}}
17
onExit={(action: "go-to-prev" | "go-to-next" | undefined) => {
18
// Called when user hits "Save", "Next", or "Prev"
19
}}
20
// when data is saved this is called
21
onModifySample={(sampleIndex, newSampleData) => {
22
// do something
23
}}
24
/>
25
</div>
26
);
27
}
Copied!
Copy link