Notebook customization and PandasGUI

Jupyter Notebook custom.js and custom.css

In the new version of Jupyter Notebook (version 7 and above), the handling of custom.js and custom.css has changed. Previously, you could use these files to customize the appearance and behavior of your notebooks. However, with the update to Jupyter Notebook 7, these files no longer work as they did in earlier versions.

For custom.css, you can still apply custom styles, but the process is slightly different. You need to place your custom.css file in the Jupyter configuration directory, typically found at ~/.jupyter/custom/.

As for custom.js, it is no longer supported in the same way. The new version of Jupyter Notebook uses a different JavaScript implementation, which means custom JavaScript modifications need to be handled differently.

Custom.js and custom.css are the two entry points for persistently customizing the notebook's user interface. They are located in the user's home directory .jupyter/custom folder and part of my dotfile repository.

Generate table of contents

Press t and c in command mode to update the table of contents below.

PandasGUI

Pandasgui provides a simple GUI for dataframe objects.

PandasGUI default settings (JSON)

In [ ]:
from pandasgui import store
In [ ]:
store.DEFAULT_SETTINGS

It's possible to set a new JSON file with the user's preferences:

https://gitlab.com/Sevepy/.dotfiles/-/raw/master/.jupyter/custom/preferences.json

In [ ]:
# this variable must be instantiated -> BEFORE <- importing the module
store.LOCAL_DATA_DIR = 'C:\\Users\\Seve\\.jupyter\\custom'
In [ ]:
import pandas as pd
from pandasgui import show

An example dataset:

In [ ]:
df = pd.read_csv("https://tessarinseve.pythonanywhere.com/staticweb/dataset_1000.csv",index_col=0)
In [ ]:
df.head
In [ ]:
show(df)
In [ ]:
from pandasgui.store import SETTINGS_STORE

Copy and paste "code export" and remove the last two lines as follows:

In [ ]:
import plotly.express as px
from pandasgui import show

if None is not None:
    df = df.dropna(subset=[None])
fig = px.scatter(data_frame=df, x='Col2', y='Col1', color='Col5', symbol=
    None, size=None, trendline=None, marginal_x=None, marginal_y=None,
    facet_row=None, facet_col=None, render_mode=SETTINGS_STORE.render_mode.
    value, )
In [ ]:
fig

Figure's Caption

Use a figure alt text to generate a caption.

Figure with caption

In [2]:
%%html
<style>

#md_img_caption {
    position: relative;
    z-index: 1000;
    display: none;
    background: blue;
    color: white;
    padding: 5px;  
}

</style>
In [ ]: