Skip to content
Web application for image labeling and segmentation
Branch: master
Clone or download
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
client Implement a basic password-protected admin page Mar 28, 2019
demo Simplify routing for the demo Mar 18, 2019
server Implement a basic password-protected admin page Mar 28, 2019
.dockerignore Dockerize the persistent parts on mounts Mar 7, 2019
.gitignore add docker-compose support Mar 11, 2019
.prettierignore Generate a GitHub static demo Mar 18, 2019
Dockerfile Simplify migrations Mar 7, 2019
LICENSE
README.md Implement a basic password-protected admin page Mar 28, 2019
docker-compose.yml update docker-compose to use uid:gid option Mar 13, 2019
make_github_demo.sh Update demo url Mar 18, 2019
package.json setup api server base Feb 7, 2019
yarn.lock

README.md

Image Labeling Tool

This web app allows you to label images, draw bounding boxes, shapes, collect information in forms with dropdowns, checkboxes and inputs.

The labeling UI provides a lot of features for drawing polygon shapes, editing them with assisted tracing with auto-tracing based on edges or an external ML model.

Use it when you need to segment and label multiple images, either yourself or by a group. This tool makes it easy to gather and later export the data in a format compatible with LabelMe. You can use this tool as an alternative to self-hosted tools like LabelMe, js-segment-annotator, etc or hosted services like LabelBox.

Labeling Demo

Demo of the labeling interface with all data served statically (no persistence, reverts on refresh).

Screenshots

Bounding box labeling:

Segmentation with polygons:

Automatic tracing:

Assisted segmentation with Tensor Flow Serving:

Project configuration and custom labeling UI:

Development

Install npm packages for client, server and the top-level folder:

yarn install
cd server && yarn install && cd ..
cd client && yarn install && cd ..

The server will run migrations on the first run if the database file doesn't exist already.

Run in the development mode:

env PORT=3000 API_PORT=3001 yarn start

Build For Production

Build the client app:

cd client && yarn run build && cd ..

Now you can run the server app in prod mode serving the client build:

env PORT=80 NODE_ENV=production node server/src/index.js

Config

The following environment variables can be tweaked:

  • PORT - the part the app is served on (dev, prod)
  • API_PORT - to differentiate the port for the API to run on (should be only used in dev)
  • UPLOADS_PATH - absolute path where the app stores uploaded images, defaults to server's folder 'uploads'
  • DATABASE_FILE_PATH - absolute path of the file where the app stores the SQLite data. Defaults to database.sqlite in the server folder
  • ADMIN_PASSWORD - sets a simple password on all non-labeler actions (stored in a hased form).

Run in Docker

The default Dockerfile points to /uploads and /db/db.sqlite for persisted data, make sure to prepare those in advance to be mounted over. Here is an example mounting a local host directory:

mkdir ~/containersmnt/
mkdir ~/containersmnt/db/
mkdir ~/containersmnt/uploads/

Now build the container:

docker build -t imslavko/image-labeling-tool .

Run attaching the mounts:

docker run -p 5000:3000 -u $(id -u):$(id -g) -v ~/containersmnt/uploads:/uploads -v ~/containersmnt/db:/db -d imslavko/image-labeling-tool

Access the site at localhost:5000.

Run with docker-compose

  • Checkout the docker-compose.yml for detailed configuration.
  • Need to set & export environment variable CURRENT_UID before running.
# if it needs to build the docker image,
CURRENT_UID=$(id -u):$(id -g) docker-compose up -d --build

# if it only needs to run,
CURRENT_UID=$(id -u):$(id -g) docker-compose up -d

Project Support and Development

This project has been developed as part of my internship at the NCSOFT Vision AI Lab in the beginning of 2019.

You can’t perform that action at this time.