jupyter-widgets / ipydatagrid

Fast Datagrid widget for the Jupyter Notebook and JupyterLab
BSD 3-Clause "New" or "Revised" License
579 stars 51 forks source link

Render a column as html #316

Closed afonit closed 2 years ago

afonit commented 2 years ago

Currently one can use VegaExpr to format all text in a cell and/or the background color of a cell.

Is there an ability to render a cell as html?

Example: I do text search/analysis and return results from the dataset, currently I use pandas as the output as I can render html within text. This helps end users focus more quickly on the terms they were searching for in the returned results.

from ipydatagrid import Expr, DataGrid, TextRenderer, HyperlinkRenderer, VegaExpr
import ipydatagrid as grid
from IPython.display import HTML
import pandas as pd

data = {
    'some_num': [2, 9, 3],
    'some_text': [
        "hello <b>you</b> dog",
        "look at that <b>pig</b>.",
        "hello <font color=orange><b>you</font></b> person"],
}

With pandas I can do:

df = pd.DataFrame(data)
df.style.set_properties(**{'text-align': 'left'}).hide_index()#.to_html()

Which looks like this: image

Searching through the existing issues and looking through https://vega.github.io/vega/docs/expressions/ I am not seeing a mechanism to do this.

on an off chance I could pass the HTML function as an argument to the TextRenderer I tried

text_renderer = TextRenderer(
    text_color=HTML,
)
DataGrid(df,
        column_widths={
            'some_text': 300,
        },
        renderers={"some_text": text_renderer}
        )

which of course did not work as it expects a color or VegaExpr.

Is there an ability or mechanism to render bolds and colors of text as I showed above in the screenshot?

ibdafna commented 2 years ago

@afonit There is no way to render HTML inside a cell as we're using canvas rendering. With that said, most of the features HTML will give you such as adjusting color, background, font, weight and font-color can be achieved using the TextRenderer object, for example:

renderer = TextRenderer(
    background_color="moccasin",
    text_color="blue",
    font="bold 14px Arial, sans-serif",
)

In your screenshot above, only parts of the sentence are highlighted in bold or a different color - there isn't a way of doing that in ipydatagrid as of yet - it will need to be the entire string.

afonit commented 2 years ago

@ibdafna , thank you for the confirmation - that one cannot highlight parts of a sentence within a cell.