Pandas Style#

Starting with itables>=1.6.0, ITables provides support for Pandas Style.

import pandas as pd
import numpy as np
from itables import init_notebook_mode

init_notebook_mode(all_interactive=True)

This is the DataFrame that we are going to style:

x = np.linspace(0, np.pi, 21)
df = pd.DataFrame({"sin": np.sin(x), "cos": np.cos(x)}, index=pd.Index(x, name="alpha"))

df
sin cos
alpha
Loading... (need help?)

Color#

From now on we will display df.style (a Pandas Styler object) rather than our DataFrame df.

Let’s start with a background gradient:

s = df.style
s.background_gradient(axis=None, cmap="YlOrRd")
  sin cos
alpha    
0.000000 0.000000 1.000000
0.157080 0.156434 0.987688
0.314159 0.309017 0.951057
0.471239 0.453990 0.891007
0.628319 0.587785 0.809017
0.785398 0.707107 0.707107
0.942478 0.809017 0.587785
1.099557 0.891007 0.453990
1.256637 0.951057 0.309017
1.413717 0.987688 0.156434
1.570796 1.000000 0.000000
1.727876 0.987688 -0.156434
1.884956 0.951057 -0.309017
2.042035 0.891007 -0.453990
2.199115 0.809017 -0.587785
2.356194 0.707107 -0.707107
2.513274 0.587785 -0.809017
2.670354 0.453990 -0.891007
2.827433 0.309017 -0.951057
2.984513 0.156434 -0.987688
3.141593 0.000000 -1.000000

Format#

We can also choose how the data is formatted:

s.format("{:.3f}").format_index("{:.3f}")
  sin cos
alpha    
0.000 0.000 1.000
0.157 0.156 0.988
0.314 0.309 0.951
0.471 0.454 0.891
0.628 0.588 0.809
0.785 0.707 0.707
0.942 0.809 0.588
1.100 0.891 0.454
1.257 0.951 0.309
1.414 0.988 0.156
1.571 1.000 0.000
1.728 0.988 -0.156
1.885 0.951 -0.309
2.042 0.891 -0.454
2.199 0.809 -0.588
2.356 0.707 -0.707
2.513 0.588 -0.809
2.670 0.454 -0.891
2.827 0.309 -0.951
2.985 0.156 -0.988
3.142 0.000 -1.000

Caption#

s.set_caption("A Pandas Styler object with background colors").set_table_styles(
    [{"selector": "caption", "props": "caption-side: bottom; font-size:1em;"}]
)
A Pandas Styler object with background colors
  sin cos
alpha    
0.000 0.000 1.000
0.157 0.156 0.988
0.314 0.309 0.951
0.471 0.454 0.891
0.628 0.588 0.809
0.785 0.707 0.707
0.942 0.809 0.588
1.100 0.891 0.454
1.257 0.951 0.309
1.414 0.988 0.156
1.571 1.000 0.000
1.728 0.988 -0.156
1.885 0.951 -0.309
2.042 0.891 -0.454
2.199 0.809 -0.588
2.356 0.707 -0.707
2.513 0.588 -0.809
2.670 0.454 -0.891
2.827 0.309 -0.951
2.985 0.156 -0.988
3.142 0.000 -1.000

Tooltips#

ttips = pd.DataFrame(
    {
        "sin": ["The sinus of {:.6f} is {:.6f}".format(t, np.sin(t)) for t in x],
        "cos": ["The cosinus of {:.6f} is {:.6f}".format(t, np.cos(t)) for t in x],
    },
    index=df.index,
)
s.set_tooltips(ttips).set_caption("With tooltips")
With tooltips
  sin cos
alpha    
0.000 0.000 1.000
0.157 0.156 0.988
0.314 0.309 0.951
0.471 0.454 0.891
0.628 0.588 0.809
0.785 0.707 0.707
0.942 0.809 0.588
1.100 0.891 0.454
1.257 0.951 0.309
1.414 0.988 0.156
1.571 1.000 0.000
1.728 0.988 -0.156
1.885 0.951 -0.309
2.042 0.891 -0.454
2.199 0.809 -0.588
2.356 0.707 -0.707
2.513 0.588 -0.809
2.670 0.454 -0.891
2.827 0.309 -0.951
2.985 0.156 -0.988
3.142 0.000 -1.000

Note

Unlike Pandas or Polar DataFrames, Styler objects are rendered directly using their to_html method, rather than passing the underlying table data to the datatables.net library.

Because of this, the rendering of the table might differ slightly from the rendering of the corresponding DataFrame. In particular,

  • The downsampling is not available - please pay attention to the size of the table being rendered

  • Sorting of numbers will not work if the column contains NaNs.