# HIDDEN
# Clear previously defined variables
%reset -f

# nbi:hide_in
import warnings
# Ignore numpy dtype warnings. These warnings are caused by an interaction
# between numpy and Cython and can be safely ignored.
# Reference: https://stackoverflow.com/a/40846742
warnings.filterwarnings("ignore", message="numpy.dtype size changed")
warnings.filterwarnings("ignore", message="numpy.ufunc size changed")

import numpy as np
import matplotlib.pyplot as plt
import pandas as pd
%matplotlib inline
import ipywidgets as widgets
from ipywidgets import interact, interactive, fixed, interact_manual
import nbinteract as nbi

np.set_printoptions(threshold=20, precision=2, suppress=True)
pd.options.display.max_rows = 7
pd.options.display.max_columns = 8
pd.set_option('precision', 2)
# This option stops scientific notation for pandas
# pd.set_option('display.float_format', '{:.2f}'.format)

# nbi:hide_in
def df_interact(df, nrows=7, ncols=7):
    '''
    Outputs sliders that show rows and columns of df
    '''
    def peek(row=0, col=0):
        return df.iloc[row:row + nrows, col:col + ncols]
    if len(df.columns) <= ncols:
        interact(peek, row=(0, len(df) - nrows, nrows), col=fixed(0))
    else:
        interact(peek,
                 row=(0, len(df) - nrows, nrows),
                 col=(0, len(df.columns) - ncols))
    print('({} rows, {} columns) total'.format(df.shape[0], df.shape[1]))

# nbi:hide_in
videos = pd.read_csv('https://github.com/SamLau95/nbinteract/raw/master/notebooks/youtube_trending.csv',
                     parse_dates=['publish_time'],
                     index_col='publish_time')

Page Layout / Dashboarding¶

nbinteract gives basic page layout functionality using special comments in your code. Include one or more of these markers in a Python comment and nbinteract will add their corresponding CSS classes to the generated cells.

Marker	Description	CSS class added
`nbi:left`	Floats cell to the left	`nbinteract-left`
`nbi:right`	Floats cell to the right	`nbinteract-right`
`nbi:hide_in`	Hides cell input	`nbinteract-hide_in`
`nbi:hide_out`	Hides cell output	`nbinteract-hide_out`

By default, only the full template will automatically provide styling for these classes. For other templates, nbinteract assumes that the embedding page will use the CSS classes to style the cells.

You can use the layout markers to create simple dashboards. In this page, we create a dashboard using a dataset of trending videos on YouTube. We first create a dashboard showing the code used to generate the plots. Further down the page, we replicate the dashboard without showing the code.

df_interact(videos)

(2435 rows, 8 columns) total

# nbi:left
options = {
    'title': 'Views for Trending Videos',
    'xlabel': 'Date Trending',
    'ylabel': 'Views',
    'animation_duration': 500,
    'aspect_ratio': 1.0,
}

def xs(channel):
    return videos.loc[videos['channel_title'] == channel].index

def ys(xs):
    return videos.loc[xs, 'views']

nbi.scatter(xs, ys,
            channel=videos['channel_title'].unique()[9:15],
            options=options)

# nbi:right
options={
    'ylabel': 'Proportion per Unit',
    'bins': 100,
    'aspect_ratio': 1.0,
}


def values(col):
    vals = videos[col]
    return vals[vals < vals.quantile(0.8)]

nbi.hist(values, col=widgets.ToggleButtons(options=['views', 'likes', 'dislikes', 'comment_count']), options=options)

Dashboard (without showing code)¶

# nbi:hide_in
df_interact(videos)

(2435 rows, 8 columns) total

# nbi:hide_in
# nbi:left
options = {
    'title': 'Views for Trending Videos',
    'xlabel': 'Date Trending',
    'ylabel': 'Views',
    'animation_duration': 500,
    'aspect_ratio': 1.0,
}

def xs(channel):
    return videos.loc[videos['channel_title'] == channel].index

def ys(xs):
    return videos.loc[xs, 'views']

nbi.scatter(xs, ys,
            channel=videos['channel_title'].unique()[9:15],
            options=options)

# nbi:hide_in
# nbi:right
options={
    'ylabel': 'Proportion per Unit',
    'bins': 100,
    'aspect_ratio': 1.0,
}


def values(col):
    vals = videos[col]
    return vals[vals < vals.quantile(0.8)]

nbi.hist(values, col=widgets.ToggleButtons(options=['views', 'likes', 'dislikes', 'comment_count']), options=options)