弹出/扩展jupyter单元格到新的浏览器窗口

时间:2016-11-11 19:24:15

标签: python jupyter-notebook jupyter

我有一个看起来像这样的jupyter笔记本电池:

enter image description here

有没有办法将其弹出/展开到新的浏览器窗口(看不到输出内联)?

基本上,我想从R / RStudio复制View()函数......这可能吗?

1 个答案:

答案 0 :(得分:18)

您可以使用Javascript打开一个新窗口,由HTML IPython.display执行。

import pandas as pd
import numpy as np
df = pd.DataFrame(np.random.randn(6,4),columns=list('ABCD'))
# Show in Jupyter
df

from IPython.display import HTML
s  = '<script type="text/Javascript">'
s += 'var win = window.open("", "Title", "toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=yes, resizable=yes, width=780, height=200, top="+(screen.height-400)+", left="+(screen.width-840));'
s += 'win.document.body.innerHTML = \'' + df.to_html().replace("\n",'\\') + '\';'
s += '</script>'

# Show in new Window
HTML(s)

此处,df.to_HTML()从包含大量换行符的数据框中创建HTML字符串。这些都是Javascript的问题。 Javascript中的多行字符串在EOL中需要反斜杠,这就是为什么python必须使用.replace()方法修改HTML字符串。

使用JavaScript .innerHTML(而不是document.write())真正酷的是,您可以随时更新您的表格,而无需创建新窗口:

df /= 2
s  = '<script type="text/Javascript">'
s += 'win.document.body.innerHTML = \'' + df.to_html().replace("\n",'\\') + '\';'
s += '</script>'
HTML(s)

这将在打开的窗口中对您的桌面产生即时效果。

enter image description here

以下是来自View() R的{​​{1}}模拟器的简单建议:

python

只需输入以下内容即可在jupyter中使用:

def View(df):
    css = """<style>
    table { border-collapse: collapse; border: 3px solid #eee; }
    table tr th:first-child { background-color: #eeeeee; color: #333; font-weight: bold }
    table thead th { background-color: #eee; color: #000; }
    tr, th, td { border: 1px solid #ccc; border-width: 1px 0 0 1px; border-collapse: collapse;
    padding: 3px; font-family: monospace; font-size: 10px }</style>
    """
    s  = '<script type="text/Javascript">'
    s += 'var win = window.open("", "Title", "toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=yes, resizable=yes, width=780, height=200, top="+(screen.height-400)+", left="+(screen.width-840));'
    s += 'win.document.body.innerHTML = \'' + (df.to_html() + css).replace("\n",'\\') + '\';'
    s += '</script>'

    return(HTML(s+css))

作为一个花哨的顶部,它还使用一些CSS为您打开的表格设置样式,使其看起来更好,与您在View(df) 中所知的相当。 enter image description here