Superscript and subscript in a DataTable cell

Dash Python
1

Is it possible to render small html snippets in a DataTable cell? If I try something thing like T<sub>1/2</sub>, the markup passes through. (This is for non-editable content).

2

Hi, did you find out how to do this at all please?

3

I did not find a way, sorry.

1 Like
4

For some characters you can use unicode superscript or subscript (you can copy and paste from the Wiki page):
https://en.wikipedia.org/wiki/Unicode_subscripts_and_superscripts

5

Thanks edbduck! Similarly, you can insert unicode characters into a page in Microsoft Word, and then copy-paste them into the datatable cell. On the Mac, most of the characters found in the Symbol menu “Arial Unicode MS” seem to work, including greek characters, degree symbols, etc. Or you can follow the instructions here: Unicode: Adding Thousands of Characters to Your Mac, to insert a large variety of unicode symbols into a MacOS Word document, and then copy-paste into the datatable.

For the PC version of Word, it’s a bit easier. Insert Unicode characters by typing the hex value of the character and then hit Alt-x.

There are a ton of resources for finding unicode values for symbols, including the one mentioned by edbduck and: Unicode/List of useful symbols - Wikibooks, open books for an open world

6

I created a couple of functions to convert strings within to superscript. If I convert the columns of the dataframe before I input into DashTable it seems to work.

def to_superscript(normal_text: str) -> str:
    """Convert string to superscript

    :param normal_text: string to convert
    :return: output in superscript
    """
    superscript_map = {
        "0": "⁰",
        "1": "¹",
        "2": "²",
        "3": "³",
        "4": "⁴",
        "5": "⁵",
        "6": "⁶",
        "7": "⁷",
        "8": "⁸",
        "9": "⁹",
        "a": "ᵃ",
        "b": "ᵇ",
        "c": "ᶜ",
        "d": "ᵈ",
        "e": "ᵉ",
        "f": "ᶠ",
        "g": "ᵍ",
        "h": "ʰ",
        "i": "ᶦ",
        "j": "ʲ",
        "k": "ᵏ",
        "l": "ˡ",
        "m": "ᵐ",
        "n": "ⁿ",
        "o": "ᵒ",
        "p": "ᵖ",
        "q": "۹",
        "r": "ʳ",
        "s": "ˢ",
        "t": "ᵗ",
        "u": "ᵘ",
        "v": "ᵛ",
        "w": "ʷ",
        "x": "ˣ",
        "y": "ʸ",
        "z": "ᶻ",
        "A": "ᴬ",
        "B": "ᴮ",
        "C": "ᶜ",
        "D": "ᴰ",
        "E": "ᴱ",
        "F": "ᶠ",
        "G": "ᴳ",
        "H": "ᴴ",
        "I": "ᴵ",
        "J": "ᴶ",
        "K": "ᴷ",
        "L": "ᴸ",
        "M": "ᴹ",
        "N": "ᴺ",
        "O": "ᴼ",
        "P": "ᴾ",
        "Q": "Q",
        "R": "ᴿ",
        "S": "ˢ",
        "T": "ᵀ",
        "U": "ᵁ",
        "V": "ⱽ",
        "W": "ᵂ",
        "X": "ˣ",
        "Y": "ʸ",
        "Z": "ᶻ",
        "+": "⁺",
        "-": "⁻",
        "=": "⁼",
        "(": "⁽",
        ")": "⁾",
    }

    transl = str.maketrans(
        "".join(superscript_map.keys()),
        "".join(superscript_map.values()),
    )
    return normal_text.translate(transl)


def replace_superscript_characters(df: pd.DataFrame, columns: list) -> pd.DataFrame:
    """Replace characters enclosed in <sup> </sup> with superscript characters.

    :param df: DataFrame
    :param columns: Column names to convert
    :return: Output DataFrame with converted characters
    """
    for column in columns:
        df[column] = df[column].str.replace(
            r"<sup>(?:[^|</sup>]*\|)?([^</sup>]*)</sup>",
            lambda m: to_superscript(m[1]),
            regex=True,
        )

    return df
1 Like