Skip to main content

Data is not shown on the labeling screen

Nikolai Liubimov
Updated

You access the labeling data via navigating to the next task while clicking on submit, or by clicking a row on Data Manager page. If you see the page is hanging, not loading, or partially loaded but some specific screens are not available, there might be problems with data format or accessibility. Try the following:

Check internet connection

Without an internet connection, you will receive a “Failed to fetch” message each time you try opening the data labeling screen. This is because data content is fetched on the client side at the time you load the app, ensuring secure data flow. Please check your internet connection and reload the page again.

Untitled__6_.png

Check data access

It is a common scenario when working with external storage that the URLs provided have no or restricted access. It can result in Not found (404) or Permission denied (403) errors.

To locate this source of error, try navigating to your browser’s Network panel and check to see if there are 403 or 404 errors.

Untitled__7_.png

To validate the link doesn’t work - copy it and try opening in a separate browser tab.

If you see the errors next to your data URLs - check the most common accessibility errors or contact your data provider.

Check CORS policy

In some cases, you have access to your data, but it still doesn’t show on the screen. That happens for specific data types when CORS headers are not given by the data provider.

To locate the issue, open browser’s Console and check for the error message similar to:

Access to XMLHttpRequest has been blocked by CORS policy : No ‘Access-Control-Allow-Origin’ header is present on the requested response

To fix CORS issue, please follow the guide.

Check import data format

In some scenarios, when you import annotations or predictions along with the input tasks data, incorrectly formatted JSON payload can lead to issues on the labeling page. It breaks javascript code execution that can be also located in the browser’s Console errors.

Please reference and follow the input data format scheme.

To locate a problematic task, use the Task ID written in the bottom left corner, e.g. Task #12345678. Use this ID to navigate the URL: https://app.heartex.com/api/tasks/12345678 and check the payload associated with annotations and predictions

If you see inconsistency with the data format - remove this task (or use API call) and upload the fixed one.

The most common issues when you import prediction and annotations:

  1. you forgot to specify region ids—they should be unique strings across the current annotation
  2. you used incorrect from_name
  3. labels are not wrapped into a list [ ]:
"value": {
  ...
  "labels": ["Car"**]
}**

Check labeling configuration

Label Studio offers a very flexible labeling configuration interface that allows you to combine various input / output data formats and apply custom styles and layouts. For example, users can specify a custom layout by injecting CSS code using <Style> component. At the same time, improperly built style definitions can interfere and break some parts of in-app layout.

To locate a browser-specific error, please try to open tasks in another browser (e.g. Chrome).

If you see the data is improperly loaded on the labeling screen, check your labeling configuration in project Settings → Labeling Interface → Code whether there are custom CSS code within <Style> or <View> components, or under style attributes. Try to remove some parts and check your labeling screen again.

A few recommendations to build a proper labeling config CSS code:

  • don’t use .lsf-.. selectors, they are for internal use
  • define classNames for tags and style them in <Style> tag
  • use display: flex or grid for convenient layouts
  • use View tags with styles to group items

Check the size of the data

Label Studio has limitations when working with large data chunks (for example, long audio or video files, documents with many pages, etc.). Check if any of the following limitations apply in your case:

  • Audio length longer than 30 minutes
  • Video length longer than 1 hour
  • High-res (4K) Video
  • Multi-page image documents (>50 pages)
  • Text files >3Mb

Check parameters of your Cloud Storage connector

A common error is specifying the incorrect bucket region location, or using an expired Session Token.

Go to the project Settings → Cloud Storage → Edit Cloud storage connector and change settings. If it doesn’t help - try to remove Cloud Storage connector and re-create it again.

Are you using data contents or URLs?

In some cases, the data is provided original content (e.g. text) or a URL pointed to the remotely stored file (e.g. http://my.data/example.txt). Make sure in the latter case you don’t forget to include valueType="url" in your object tag. Please read how to import data in the guide.

Related articles