Как я могу выровнять выходы (диаграммы) в Google Colab?

Question

Есть ли способ выровнять выходные данные кода в Google Colab?

В Jupyter Notebook я использую

from IPython.display import HTML, display

display(HTML("""
<style>
.output {
    display: flex;
    align-items: center;
    text-align: center;
}
</style>
"""))

, который выравнивает выходные данные кода (например, графическую диаграмму) по центр. Google Colab не выдает никакой ошибки, но он полностью игнорирует код, и все остается выровненным. Кто-нибудь сталкивался с этой проблемой и решил ее?

Большое спасибо!

Answer 1

Выходы Colab имеют свой собственный iframe, поэтому CSS, определенный в одном выходе, не повлияет на отображение других выходов. Кроме того, структура DOM выходов ячеек в Colab немного отличается от структуры в ноутбуке Jupyter или JupyterLab (которые сами немного отличаются друг от друга).

Попробуйте поместить этот в одну и ту же ячейку в качестве создаваемых вами диаграмм:

display(HTML("""
<style>
#output-body {
    display: flex;
    align-items: center;
    justify-content: center;
}
</style>
"""))

Пример:

from IPython.display import HTML, display

display(HTML("""
<style>
#output-body {
    display: flex;
    align-items: center;
    justify-content: center;
}
</style>
"""))

import plotly.express as px
df = px.data.tips()
fig = px.scatter(df, x="total_bill", y="tip",
                width=300, height=300)

fig.show()
fig.show()