数据标签React应用程序,与后端无关,可以嵌入到您的服务中。

Sergey Zhuk 427266ef0c ci: update autolabeler.yml 2 days ago
.github 427266ef0c ci: update autolabeler.yml 2 days ago
e2e 77dd0e2e61 fix: LSDV-4649: Regrouping regions after switching annotations (#1223) 1 week ago
examples a75b52f99c feat: LSDV-4583-6: Image preloading (#1187) 3 weeks ago
images 18fc2e5213 feat: DEV-4081: Implements Magic Wand tool for image segmentation (#1119) 1 month ago
public a75b52f99c feat: LSDV-4583-6: Image preloading (#1187) 3 weeks ago
scripts 4ad8edb32a feat: LSDV-3028: Audio v3 dual channel render (#1185) 1 month ago
src 855a86ca2b docs: LSDV-4754: Update Audio documentation to point to v3 (#1242) 2 days ago
types a75b52f99c feat: LSDV-4583-6: Image preloading (#1187) 3 weeks ago
.babelrc 98f0617a67 chore: DEV-3855: Fix Jest tests (#1037) 3 months ago
.env.defaults 5ee06dd48e Editor refreshed UI (#189) 1 year ago
.env.example 18f6251c0d Update packages (fixing vulnerabilities) 1 year ago
.eslintignore 7b58096e4f fix: DEV-3820: Universal readonly (#1053) 3 weeks ago
.eslintrc.js 4033fe2820 chore: DEV-3856: Setup ESLint CI (#1047) 3 months ago
.gitignore 387e17836c fix: Video improvements (#497) 11 months ago
.npmrc c10e9935d5 Release 1.4 (#366) 1 year ago
.prettierignore 8013332652 initial port to separate github repo of the frontend part of Label Studio 3 years ago
.prettierrc 8013332652 initial port to separate github repo of the frontend part of Label Studio 3 years ago
.travis.yml 8013332652 initial port to separate github repo of the frontend part of Label Studio 3 years ago
CHANGELOG.md 8013332652 initial port to separate github repo of the frontend part of Label Studio 3 years ago
CODE_OF_CONDUCT.md 8013332652 initial port to separate github repo of the frontend part of Label Studio 3 years ago
CONTRIBUTING.md 8013332652 initial port to separate github repo of the frontend part of Label Studio 3 years ago
LICENSE 8013332652 initial port to separate github repo of the frontend part of Label Studio 3 years ago
README.md 9dbe9a4195 docs: Update links in readme 2 months ago
codecov.yml 0eeb12dca3 chore: DEV-3947: Add e2e tests coverage to reports (#1076) 1 month ago
dev-server.js fad0915a10 Allow selecting task id in topbar 1 year ago
jest.config.js 3d56cefbaa feat: LSDV-3023: Annotation Tab Carousel (#1188) 1 week ago
nyc.config.js 0eeb12dca3 chore: DEV-3947: Add e2e tests coverage to reports (#1076) 1 month ago
package.json 8969ae4509 fix: LSDV-4752: Support relations in MIG scenario (#1240) 1 week ago
tsconfig.jest.json 98f0617a67 chore: DEV-3855: Fix Jest tests (#1037) 3 months ago
tsconfig.json 5ee06dd48e Editor refreshed UI (#189) 1 year ago
webpack.config-builder.js a75b52f99c feat: LSDV-4583-6: Image preloading (#1187) 3 weeks ago
webpack.config.js 5ee06dd48e Editor refreshed UI (#189) 1 year ago
yarn.lock 8969ae4509 fix: LSDV-4752: Support relations in MIG scenario (#1240) 1 week ago

README.md

Label Studio Frontend · GitHub build npm audit

GitHub release · :sunny:

WebsiteDocsTwitterJoin Slack Community


Label Studio is an open-source, configurable data annotation tool. :v:

Frontend, as its name suggests, is the frontend library developed using React and mobx-state-tree, distributed as an NPM package. You can include it in your applications and provide data annotation support to your users. It can be granularly customized and extended.


Install

npm install @heartexlabs/label-studio

Usage

With Webpack

import LabelStudio from 'label-studio';
import 'label-studio/build/static/css/main.css';

With UNPKG.com

<!-- Include Label Studio stylesheet -->
<link href="https://unpkg.com/label-studio@1.4.0/build/static/css/main.css" rel="stylesheet">

<!-- Create the Label Studio container -->
<div id="label-studio"></div>

<!-- Include the Label Studio library -->
<script src="https://unpkg.com/label-studio@1.4.0/build/static/js/main.js"></script>

Initialization

<!-- Initialize Label Studio -->
<script>
  var labelStudio = new LabelStudio('label-studio', {
    config: `
      <View>
        <Image name="img" value="$image"></Image>
        <RectangleLabels name="tag" toName="img">
          <Label value="Hello"></Label>
          <Label value="World"></Label>
        </RectangleLabels>
      </View>
    `,

    interfaces: [
      "panel",
      "update",
      "submit",
      "controls",
      "side-column",
      "annotations:menu",
      "annotations:add-new",
      "annotations:delete",
      "predictions:menu",
    ],

    user: {
      pk: 1,
      firstName: "James",
      lastName: "Dean"
    },

    task: {
      annotations: [],
      predictions: [],
      id: 1,
      data: {
        image: "https://htx-misc.s3.amazonaws.com/opensource/label-studio/examples/images/nick-owuor-astro-nic-visuals-wDifg5xc9Z4-unsplash.jpg"
      }
    },

    onLabelStudioLoad: function(LS) {
      var c = LS.annotationStore.addAnnotation({
        userGenerate: true
      });
      LS.annotationStore.selectAnnotation(c.id);
    }
  });
</script>

Development

  1. Clone the repository

    git clone git@github.com:heartexlabs/label-studio-frontend.git
    # or: git clone https://github.com/heartexlabs/label-studio-frontend.git
    cd label-studio-frontend
    
    1. Install required dependencies bash npm install
  2. Start the development server

    npm run start
    
    1. Check different ways to initiate the development server config & task data in src/env/development.js, changing the data variable is a good place to start.

    2. After you make changes and ready to use it in production, you need to create a production build

      npm run build-bundle
      

Now you have one .js file and one .css file in the build/static/ directory

Label Studio for Teams, Startups, and Enterprises :office:

Label Studio for Teams is our enterprise edition (cloud & on-prem), that includes a data manager, high-quality baseline models, active learning, collaborators support, and more. Please visit the website to learn more.

Ecosystem

| Project | Description | |-|-| | label-studio | Server part, distributed as a pip package | | label-studio-frontend | Frontend part, written in JavaScript and React, can be embedded into your application | | label-studio-converter | Encode labels into the format of your favorite machine learning library | | label-studio-transformers | Transformers library connected and configured for use with label studio |

License

This software is licensed under the Apache 2.0 LICENSE © Heartex. 2020