A simple component to display annotated text in Streamlit apps.

Overview

Annotated Text Component for Streamlit

A simple component to display annotated text in Streamlit apps. For example:

Example image

Installation

First install Streamlit (of course!) then pip-install this library:

pip install streamlit
pip install st-annotated-text

Example

import streamlit as st
from annotated_text import annotated_text

"""
# Annotated text example

Below is an example of how to use the annotated_text function:
"""

annotated_text(
    "This ",
    ("is", "verb", "#8ef"),
    " some ",
    ("annotated", "adj", "#faa"),
    ("text", "noun", "#afa"),
    " for those of ",
    ("you", "pronoun", "#fea"),
    " who ",
    ("like", "verb", "#8ef"),
    " this sort of ",
    ("thing", "noun", "#afa"),
)

Parameters

The annotated_text() function accepts any number of the following arguments:

  • strings, to draw the string as-is on the screen.
  • tuples of the form (main_text, annotation_text, background, color) where background and foreground colors are optional and should be an CSS-valid string such as "#aabbcc" or "rgb(10, 20, 30)"
  • htbuilder.HtmlElement objects in case you want to customize the annotations further. In particular, you can import the annotation() function from this module to easily produce annotations whose CSS you can customize via keyword arguments.

To-do

Just one to-do:

  • Write tests! Contributions accepted 😉
Comments
  • pip install location

    pip install location

    Hi, just trying out the library, seems to work great!

    But for me, when installing via pypi, the library was installed as annotated_text not as st_annotated_text, so instead of the instructions in the README, I had to:

    from annotated_text import annotated_text
    
    opened by ecatkins 6
  • Option to provide height of the iframe

    Option to provide height of the iframe

    Please provide an option to set the height of the output iframe. https://docs.streamlit.io/en/stable/develop_streamlit_components.html#streamlit.components.v1.html

    opened by jithurjacob 4
  • Feature Request - Auto Anno text if marked

    Feature Request - Auto Anno text if marked

    Is it possible to extend this component so that if I mark I word with my courser, it gets automatically annotated by the class I chose in advance? Just an ide I wanted to share. I'd really much like it.

    opened by ChrisDelClea 3
  • ImportError: cannot import name 'div'

    ImportError: cannot import name 'div'

    i cannot use the component , and get this error, i am working on python 3.6.9 and ubuntu 18.04 with virtualenv during pip install i saw this "Failed building wheel for htbuilder" "Failed to build st-annotated-text-htbuilder" Installing collected packages: iteration -builder.................................. When running the app, it shows error: line 4, in from annotated_text import annotated_text error: in from htbuilder import HtmlElement, div, span, styles

    thanks if can resolve 
    
    opened by apexbb 3
  • Dark Mode support

    Dark Mode support

    Streamlit applications using this component are not properly visible when preferring Dark Mode or have it set as system default.

    Light Mode

    st_annotated_text_light_mode

    Dark Mode

    st_annotated_text_dark_mode

    The non-highlighted text colors should inherit from the current Theme (Light/Dark/Custom).

    opened by philippedeb 2
  • How would I submit a list of tuples?

    How would I submit a list of tuples?

    Using spacy to get part of speech tagging, and essentially emulating displacy I built myself a quick annotation getting function:

    `def get_annotations(text): result = [] d = { 'ADJ':'#7FFFD4', 'PROPN':'#7FFF00', 'AUX':'#9932CC', 'VERB':'#556B2F', 'NOUN':'#BDB76B' } k = set(list(d.keys())) doc = nlp(text) for x in doc: token = "" if x.pos_ in k: token = (x.text, x.pos_, d.get(x.pos_)) else: token = x.text

        result.append(token)
    return tuple(result)
    

    `

    My issue comes up when submitting the result to annotated_text(). In fact, if I save the example's sample text to a variable I get an oh noes error. Is there any way of passing a tuple of tuples or a list of tuples?

    opened by dorealex 2
  • Any Text Limitations in this Library?

    Any Text Limitations in this Library?

    Hi,

    Do we have any limitations in the height of text to displayed in streamlit via this function? The text I am using is a 8 times duplication of the same set of arguments given in the document example. This is showing the visualization only very few text annotations and hides remaining.

    For Example:

    Here is the annotations I pass to the function:

    annotated_text(
        "This ",
        ("is", "verb", "#8ef"),
        " some ",
        ("annotated", "adj", "#faa"),
        ("text", "noun", "#afa"),
        " for those of ",
        ("you", "pronoun", "#fea"),
        " who ",
        ("like", "verb", "#8ef"),
        " this sort of ",
        ("thing", "noun", "#afa"),
        "This ",
        ("is", "verb", "#8ef"),
        " some ",
        ("annotated", "adj", "#faa"),
        ("text", "noun", "#afa"),
        " for those of ",
        ("you", "pronoun", "#fea"),
        " who ",
        ("like", "verb", "#8ef"),
        " this sort of ",
        ("thing", "noun", "#afa"),
        "This ",
        ("is", "verb", "#8ef"),
        " some ",
        ("annotated", "adj", "#faa"),
        ("text", "noun", "#afa"),
        " for those of ",
        ("you", "pronoun", "#fea"),
        " who ",
        ("like", "verb", "#8ef"),
        " this sort of ",
        ("thing", "noun", "#afa"),
        "This ",
        ("is", "verb", "#8ef"),
        " some ",
        ("annotated", "adj", "#faa"),
        ("text", "noun", "#afa"),
        " for those of ",
        ("you", "pronoun", "#fea"),
        " who ",
        ("like", "verb", "#8ef"),
        " this sort of ",
        ("thing", "noun", "#afa"),
        "This ",
        ("is", "verb", "#8ef"),
        " some ",
        ("annotated", "adj", "#faa"),
        ("text", "noun", "#afa"),
        " for those of ",
        ("you", "pronoun", "#fea"),
        " who ",
        ("like", "verb", "#8ef"),
        " this sort of ",
        ("thing", "noun", "#afa"),
        "This ",
        ("is", "verb", "#8ef"),
        " some ",
        ("annotated", "adj", "#faa"),
        ("text", "noun", "#afa"),
        " for those of ",
        ("you", "pronoun", "#fea"),
        " who ",
        ("like", "verb", "#8ef"),
        " this sort of ",
        ("thing", "noun", "#afa"),
        "This ",
        ("is", "verb", "#8ef"),
        " some ",
        ("annotated", "adj", "#faa"),
        ("text", "noun", "#afa"),
        " for those of ",
        ("you", "pronoun", "#fea"),
        " who ",
        ("like", "verb", "#8ef"),
        " this sort of ",
        ("thing", "noun", "#afa"),
        "This ",
        ("is", "verb", "#8ef"),
        " some ",
        ("annotated", "adj", "#faa"),
        ("text", "noun", "#afa"),
        " for those of ",
        ("you", "pronoun", "#fea"),
        " who ",
        ("like", "verb", "#8ef"),
        " this sort of ",
        ("thing", "noun", "#afa"),
        "This ",
        ("is", "verb", "#8ef"),
        " some ",
        ("annotated", "adj", "#faa"),
        ("text", "noun", "#afa"),
        " for those of ",
        ("you", "pronoun", "#fea"),
        " who ",
        ("like", "verb", "#8ef"),
        " this sort of ",
        ("thing", "noun", "#afa"),
        "This ",
        ("is", "verb", "#8ef"),
        " some ",
        ("annotated", "adj", "#faa"),
        ("text", "noun", "#afa"),
        " for those of ",
        ("you", "pronoun", "#fea"),
        " who ",
        ("like", "verb", "#8ef"),
        " this sort of ",
        ("thing", "noun", "#afa"),
        "This ",
        ("is", "verb", "#8ef"),
        " some ",
        ("annotated", "adj", "#faa"),
        ("text", "noun", "#afa"),
        " for those of ",
        ("you", "pronoun", "#fea"),
        " who ",
        ("like", "verb", "#8ef"),
        " this sort of ",
        ("thing", "noun", "#afa"),
        "This ",
        ("is", "verb", "#8ef"),
        " some ",
        ("annotated", "adj", "#faa"),
        ("text", "noun", "#afa"),
        " for those of ",
        ("you", "pronoun", "#fea"),
        " who ",
        ("like", "verb", "#8ef"),
        " this sort of ",
        ("thing", "noun", "#afa"),
        "This ",
        ("is", "verb", "#8ef"),
        " some ",
        ("annotated", "adj", "#faa"),
        ("text", "noun", "#afa"),
        " for those of ",
        ("you", "pronoun", "#fea"),
        " who ",
        ("like", "verb", "#8ef"),
        " this sort of ",
        ("thing", "noun", "#afa"),
        "This ",
        ("is", "verb", "#8ef"),
        " some ",
        ("annotated", "adj", "#faa"),
        ("text", "noun", "#afa"),
        " for those of ",
        ("you", "pronoun", "#fea"),
        " who ",
        ("like", "verb", "#8ef"),
        " this sort of ",
        ("thing", "noun", "#afa"),
        "This ",
        ("is", "verb", "#8ef"),
        " some ",
        ("annotated", "adj", "#faa"),
        ("text", "noun", "#afa"),
        " for those of ",
        ("you", "pronoun", "#fea"),
        " who ",
        ("like", "verb", "#8ef"),
        " this sort of ",
        ("thing", "noun", "#afa"),
        "This ",
        ("is", "verb", "#8ef"),
        " some ",
        ("annotated", "adj", "#faa"),
        ("text", "noun", "#afa"),
        " for those of ",
        ("you", "pronoun", "#fea"),
        " who ",
        ("like", "verb", "#8ef"),
        " this sort of ",
        ("thing", "noun", "#afa"),
        "This ",
        ("is", "verb", "#8ef"),
        " some ",
        ("annotated", "adj", "#faa"),
        ("text", "noun", "#afa"),
        " for those of ",
        ("you", "pronoun", "#fea"),
        " who ",
        ("like", "verb", "#8ef"),
        " this sort of ",
        ("thing", "noun", "#afa"),
        "This ",
        ("is", "verb", "#8ef"),
        " some ",
        ("annotated", "adj", "#faa"),
        ("text", "noun", "#afa"),
        " for those of ",
        ("you", "pronoun", "#fea"),
        " who ",
        ("like", "verb", "#8ef"),
        " this sort of ",
        ("thing", "noun", "#afa"),
    
    )
    

    Output:

    This is VERB some annotated ADJ text NOUN for those of you PRONOUN who like VERB this sort of thing NOUN This is VERB some annotated ADJ text NOUN for those of you PRONOUN who like VERB this sort of thing NOUN This is VERB some annotated ADJ text NOUN for those of you PRONOUN who like VERB this sort of thing NOUN This is VERB some annotated ADJ text NOUN for those of you PRONOUN

    Remaining text doesnt appear in the output (UI). I had also changed the texts but its limiting to few arguments only. When I inspect, I see all the data available in the inspection but not getting displayed in frontend.

    What could be the issue? Am I missing something or this is a limitation?

    Thanks.

    opened by chakra-ai 2
  • cannot import module

    cannot import module

    Hi,

    I have st-annotated-text installed using pip, but I cannot import the module as described in your readme-file.

    This is what I get when I enter pip show st-annotated-text:

    Name: st-annotated-text Version: 1.0.1 Summary: A simple component to display annotated text in Streamlit apps. Home-page: https://github.com/tvst/st-annotated-text Author: Thiago Teixeira Author-email: [email protected] License: Apache 2 Location: /home/monique/anaconda3/envs/ta/lib/python3.6/site-packages Requires: htbuilder Required-by:

    So, everything looks good.

    However, when I then say: from st_annotated_text import annotated_text

    It gives me the module not found-error. I was trying to figure out what the package name should be, but no luck, since I am not that hardcore python-developer.

    Perhaps there is an easy solution.

    opened by Monique497 2
  • Update util.py

    Update util.py

    For where label = "": Remove padding around label if "" is sent in (unlikely anyone wants it). Optionally - use None for no padding and "" for padding?

    Resolves #25

    opened by alexespencer 1
  • Highlight a long text except first few words of text without splitting into different lines

    Highlight a long text except first few words of text without splitting into different lines

    Hi,

    I am trying to highlight a long sentence (sentence greater than width parameter), except specific substring in the beginning of the text like below.

    image

    Code used:

    answer = "As you can see, streamlit is an open-source Python library that makes it easy to create and share beautiful, custom web apps for machine learning and data science."
    context = "Streamlit is an open-source Python library that makes it easy to create and share beautiful, custom web apps for machine learning and data science."
    
    height = int(len(context)) * 0.3 + 30
    
    annotated_text(answer.replace(context[0].lower() + context[1:], ""), (context[0].lower() + context[1:], "Longer", "#8cff66"))
    

    As you see in the above image, the substring "As you can see" which I don't want to highlight is getting printed in a different line. This is happening because the sentence length is higher than the default line width of page.

    But, the output I am expecting is something like this:

    image

    Conclusion:

    I want to highlight a text longer than line width of page except the specific substring at the begin of the text. But I do not want that non-highlighted substring to be printed as a different line.

    Is it possible to achieve this using st-annotated-text? Any help is appreciated.

    @tvst

    opened by yaminipreethi 1
  • streamlit themes support

    streamlit themes support

    Hi,

    I am currently using streamlit themes and trying to display annoated text and it always shows the text in black. Please see the sample below for your reference. Kindly guide me in resolving this issue.

    Screenshot 2021-08-30 at 6 23 05 PM

    opened by munivinayk 1
  • Install st-annotated-text with pip

    Install st-annotated-text with pip

    Hello i would like to install st-annotated-text, but when tried with pip installation, it shows error and states that visual c++ is required. I don't have visual studio c++ installed in my system. Hence if possible kindly provide '.whl' file of st-annotated-text, so that I can insta it with out Visual studio.

    opened by dove88 0
  • Change background of the annotation text output

    Change background of the annotation text output

    hi @tvst , I have recently started working this awesome library I loved the concept of the library, I wanted to know can we change the background color of the printed output using annotation_text(*list1)

    I tried nesting it with st.success and st.markdown but it does not work the way like i indended (anything similar to st.success green background will work )

    opened by hunaidkhan2000 0
  • added list support

    added list support

    modified util.py to accept list of elements as input.

    so far, elements have to be passed on like below,

    annotated_text(
        "This ",    ("is", "verb", "#8ef"),    " some ",    ("annotated", "adj", "#faa"),    ("text", "noun", "#afa"),    " for those of ",
        ("you", "pronoun", "#fea"),    " who ",    ("like", "verb", "#8ef"),    " this sort of ",    ("thing", "noun", "#afa"),    "."
    )
    
    

    with this PR, we can pass a list

    any_list =    ["This ",   ("is", "verb", "#8ef"),    " some ",    ("annotated", "adj", "#faa"),    ("text", "noun", "#afa"),    " for those of ",    ("you", "pronoun", "#fea"),     " who ",    ("like", "verb", "#8ef"),    " this sort of ",    ("thing", "noun", "#afa"),    "."]
    
    annotated_text(any_list)
    
    opened by prashantkodali 2
  • No padding if annotation is

    No padding if annotation is "" or None

    Hello, sometimes I want to highlight (colour) some text but not provide an annotation like NOUN or VERB. However, if I provide "" I still get the padding which looks a bit odd.

    I'll be taking a look at the code my end, and if I manage to change the behaviour I'll submit a PR if that's OK?

    opened by alexespencer 0
Owner
Thiago Teixeira
co-founder @ Streamlit
Thiago Teixeira
Repository for playing the computer vision apps: People analytics on Raspberry Pi.

play-with-torch Repository for playing the computer vision apps: People analytics on Raspberry Pi. Tools Tested Hardware RasberryPi 4 Model B here, RA

eMHa 1 Sep 23, 2021
Image Detector and Convertor App created using python's Pillow, OpenCV, cvlib, numpy and streamlit packages.

Image Detector and Convertor App created using python's Pillow, OpenCV, cvlib, numpy and streamlit packages.

Siva Prakash 11 Jan 2, 2022
Deskew is a command line tool for deskewing scanned text documents. It uses Hough transform to detect "text lines" in the image. As an output, you get an image rotated so that the lines are horizontal.

Deskew by Marek Mauder https://galfar.vevb.net/deskew https://github.com/galfar/deskew v1.30 2019-06-07 Overview Deskew is a command line tool for des

Marek Mauder 127 Dec 3, 2022
An Implementation of the alogrithm in paper IncepText: A New Inception-Text Module with Deformable PSROI Pooling for Multi-Oriented Scene Text Detection

InceptText-Tensorflow An Implementation of the alogrithm in paper IncepText: A New Inception-Text Module with Deformable PSROI Pooling for Multi-Orien

GeorgeJoe 115 Dec 12, 2022
Code for the paper STN-OCR: A single Neural Network for Text Detection and Text Recognition

STN-OCR: A single Neural Network for Text Detection and Text Recognition This repository contains the code for the paper: STN-OCR: A single Neural Net

Christian Bartz 496 Jan 5, 2023
text detection mainly based on ctpn model in tensorflow, id card detect, connectionist text proposal network

text-detection-ctpn Scene text detection based on ctpn (connectionist text proposal network). It is implemented in tensorflow. The origin paper can be

Shaohui Ruan 3.3k Dec 30, 2022
keras复现场景文本检测网络CPTN: 《Detecting Text in Natural Image with Connectionist Text Proposal Network》;欢迎试用,关注,并反馈问题...

keras-ctpn [TOC] 说明 预测 训练 例子 4.1 ICDAR2015 4.1.1 带侧边细化 4.1.2 不带带侧边细化 4.1.3 做数据增广-水平翻转 4.2 ICDAR2017 4.3 其它数据集 toDoList 总结 说明 本工程是keras实现的CPTN: Detecti

mick.yi 107 Jan 9, 2023
Detecting Text in Natural Image with Connectionist Text Proposal Network (ECCV'16)

Detecting Text in Natural Image with Connectionist Text Proposal Network The codes are used for implementing CTPN for scene text detection, described

Tian Zhi 1.3k Dec 22, 2022
huoyijie 1.2k Dec 29, 2022
OCR system for Arabic language that converts images of typed text to machine-encoded text.

Arabic OCR OCR system for Arabic language that converts images of typed text to machine-encoded text. The system currently supports only letters (29 l

Hussein Youssef 144 Jan 5, 2023
OCR, Scene-Text-Understanding, Text Recognition

Scene-Text-Understanding Survey [2015-PAMI] Text Detection and Recognition in Imagery: A Survey paper [2014-Front.Comput.Sci] Scene Text Detection and

Alan Tang 354 Dec 12, 2022
Total Text Dataset. It consists of 1555 images with more than 3 different text orientations: Horizontal, Multi-Oriented, and Curved, one of a kind.

Total-Text-Dataset (Official site) Updated on April 29, 2020 (Detection leaderboard is updated - highlighted E2E methods. Thank you shine-lcy.) Update

Chee Seng Chan 671 Dec 27, 2022
Code related to "Have Your Text and Use It Too! End-to-End Neural Data-to-Text Generation with Semantic Fidelity" paper

DataTuner You have just found the DataTuner. This repository provides tools for fine-tuning language models for a task. See LICENSE.txt for license de

null 81 Jan 1, 2023
Handwritten Text Recognition (HTR) system implemented with TensorFlow (TF) and trained on the IAM off-line HTR dataset. This Neural Network (NN) model recognizes the text contained in the images of segmented words.

Handwritten-Text-Recognition Handwritten Text Recognition (HTR) system implemented with TensorFlow (TF) and trained on the IAM off-line HTR dataset. T

null 27 Jan 8, 2023
Code for generating synthetic text images as described in "Synthetic Data for Text Localisation in Natural Images", Ankush Gupta, Andrea Vedaldi, Andrew Zisserman, CVPR 2016.

SynthText Code for generating synthetic text images as described in "Synthetic Data for Text Localisation in Natural Images", Ankush Gupta, Andrea Ved

Ankush Gupta 1.8k Dec 28, 2022
This can be use to convert text in a file to handwritten text.

TextToHandwriting This can be used to convert text to handwriting. Clone this project or download the code. Run TextToImage.py give the filename of th

Ashutosh Mahapatra 2 Feb 6, 2022
MORAN: A Multi-Object Rectified Attention Network for Scene Text Recognition

MORAN: A Multi-Object Rectified Attention Network for Scene Text Recognition Python 2.7 Python 3.6 MORAN is a network with rectification mechanism for

Canjie Luo 595 Dec 27, 2022
Perspective recovery of text using transformed ellipses

unproject_text Perspective recovery of text using transformed ellipses. See full writeup at https://mzucker.github.io/2016/10/11/unprojecting-text-wit

Matt Zucker 111 Nov 13, 2022
Text page dewarping using a "cubic sheet" model

page_dewarp Page dewarping and thresholding using a "cubic sheet" model - see full writeup at https://mzucker.github.io/2016/08/15/page-dewarping.html

Matt Zucker 1.2k Dec 29, 2022