New Components: Dash File Cache, Dash JSON Grid, and Dash Picture Annotation

Dash Python
,
1

Hello, all!

I am the author of the three packages: Dash File Cache, Dash JSON Grid, and Dash Picture Annotation. I am willing to introduces these packages to you.

Dash File Cache

A package used for dynamically providing the server-side files to the browser. With this package, you do not need to put everything in assets folder or use data URLs, thus allowing you to send a file with an arbitrary size. It also provides two customized components named PlainDownloader and Downloader. Different from the native dcc.Download, these components can be used for downloading large-size, authentication-protected, or cross-site files.

See the documentation here: Hello from Dash File Cache | Dash File Cache

pip install dash-file-cache
Dash File Cache

Dash JSON Grid

DashJsonGrid is a component that is used for visualizing hierarchical and complicated JSON data. Different from text-based JSON viewers, DashJsonGrid renders the data as a nested table.

See the documentation here: Hello from Dash JSON Grid | Dash JSON Grid

pip install dash-json-grid
Dash JSON Grid

Dash Picture Annotation

DashPictureAnnotation is a component rendering an annotation tool for labeling the data used for the object detection. It implements a minimal annotator based on canvas.

See the documentation here: Hello from Dash Picture Annotation | Dash Picture Annotation

pip install dash-picture-annotation
Dash Picture Annotation
6 Likes
2

Thank you for creating these Dash components @cainmagi . What was the reason you decided to build them? Did you need them for your own Dash app?

3

Hello, @adamschroeder !

I developed Dash File Cache mainly for two purposes:

  • Serve large-size files. In some projects, I need to dynamically create a large and zipped file and let users download it. I noticed that the native dash provides a feature that encodes the whole file as a byte string and sends it as a blob, which is not suitable for providing a large file. This package can put the large-size file in the disk first and read the temporary file as a data stream. Then, I can use a <a> tag or StreamSaver.js to download it.
  • Serve large-size images/IFrames. A backend program I used will create an HTML file by bokeh. This file contains a single chart. Previously, I tried to use <iframe> with a data URL to display it. However, when the file exceeds a specific size, the chart will not work correctly. For example, the colors of the curves may fall back to black. I am not very sure whether this issue is caused by the size limitation of the Data URL. However, after I implemented this package, I found this issue could be solved.
  • I noticed that this package is somehow overlapped with Dash Dynamic Images, but this package has two main differences:
    • The dynamic files can be put in the memory or the disk, thus why I call it a “file cache”. A size-limited LRU cache is used to manage the life cycle of the dynamic files. Users can configure the cache and let the file be automatically removed once it is accessed.
    • The file type is not limited to images. That means this package can be used in a more general case.

Dash JSON Grid is a package used to visualize complicated JSON data. I used it to visualize some configuration files (for example, the model configuration file of Yolo).

To my knowledge, this should be the first package that renders the JSON data as a nested table which is easier to read.

Dash Picture Annotation is motivated to provide a labeling tool for the object detection task. I used it to build an app to label the images in a PDF file, where I rendered each page as an image, detected the bounding box of images if the PDF was digital, and rendered the bounding boxes with Dash Picture Annotation. Users can tag each bounding box with different object categories or manually adjust the bounding boxes.

I noticed that its functionality is overlapped with Dash Annotate-cv. However, Dash Annotate-cv is a standalone app, but this package provides a component. The component can be used in a more general case.

Sincerely,
cainmagi

2 Likes
4

Necessity is the mother of invention :slight_smile:
I’m really glad you’re part of our community.

1 Like