4

I trying to display two tables side-by-side in a Jupyter notebook. I have some code that does this:

header = ["Metric", "Test dataset"]

table1 = [["accuracy",               accuracy_test],
          ["precision",              precision_test],
          ["recall",                 recall_test],
          ["misclassification rate", misclassification_rate_test],
          ["F1",                     F1_test],
          ["r2",                     r2_test],
          ["AUC",                    auc_test],
          ["mse",                    mse_test],
          ["logloss",                logloss_test]
          ]

table2 = [['accuracy',               0.91943799],
          ['precision',              0.89705603],
          ['recall',                 0.94877461],
          ['misclassification rate', 0.08056201],
          ['F1',                     0.92219076],
          ['r2',                     0.67773888],
          ['AUC',                    0.91924997],
          ['mse',                    0.08056201],
          ['logloss',                2.78255718]]

def display_side_by_side(dfs:list, captions:list):
    output = ""
    combined = dict(zip(captions, dfs))
    styles = [
        dict(selector="caption", props=[("caption-side", "center"), ("font-size", "100%"), ("color", )])]
    for caption, df in combined.items():
        output += df.style.set_table_attributes("style='display:inline; font-size:110%' ").set_caption(caption)._repr_html_()
        output += "\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0\xa0"
    display(HTML(output))

df1 = pd.DataFrame(table1, columns=header)
df2 = pd.DataFrame(table2, columns=header)

display_side_by_side([df1, df2], ['Current Performance', 'Previous Performance'])

The output in my Jupyter notebook looks like:

enter image description here

Notice that the captions are in a light color and they are not centered above the tables. How can I fix this?

Charles

user274610
  • 509
  • 9
  • 18

1 Answers1

7

You have already defined the styles, but you did not include them. The syntax is also a bit incorrect.

styles = [dict(selector="caption", 
    props=[("text-align", "center"),
    ("font-size", "120%"),
    ("color", 'black')])]    # the color value can not be None
# ...

    output += df.style.set_table_attributes("style='display:inline; font-size:110%' ")
        .set_caption(caption)
        .set_table_styles(styles)    # include styles
        ._repr_html_()
Dimitri L.
  • 4,499
  • 1
  • 15
  • 19