Як збільшити ширину комірок ноутбука Jupyter / ipython у своєму браузері?

Я хотів би збільшити ширину ноутбука ipython у своєму браузері. У мене екран з високою роздільною здатністю, і я хотів би розширити ширину / розмір комірок, щоб використовувати цей додатковий простір.

Дякую!

редакція: 5/2017

Зараз я використовую jupyterthemes: https://github.com/dunovank/jupyter-themes

і ця команда:

jt -t oceans16 -f roboto -fs 12 -cellw 100%

що встановлює ширину на 100% приємною темою.

Якщо ви не хочете змінювати налаштування за замовчуванням, а ви хочете змінити лише ширину поточного ноутбука, над яким ви працюєте, ви можете ввести наступне в клітинку:

from IPython.core.display import display, HTML
display(HTML("<style>.container { width:100% !important; }</style>"))

Це div.cellрішення насправді не працювало на моєму IPython, проте, на щастя, хтось запропонував робоче рішення для нових IPythonov:

Створіть файл ~/.ipython/profile_default/static/custom/custom.css(iPython) або ~/.jupyter/custom/custom.css(Jupyter) із вмістом

.container { width:100% !important; }

Потім перезапустіть ноутбуки iPython / Jupyter. Зауважте, що це вплине на всі ноутбуки.

Щоб я працював з юпітером (версія 4.0.6), я створив ~/.jupyter/custom/custom.css:

/* Make the notebook cells take almost all available width */
.container {
    width: 99% !important;
}   

/* Prevent the edit cell highlight box from getting clipped;
 * important so that it also works when cell is in edit mode*/
div.cell.selected {
    border-left-width: 1px !important;
}

Настав час використовувати юпітерлаб

Нарешті, необхідне оновлення надійшло до ноутбуків. За замовчуванням він використовує повну ширину вашого вікна, як і будь-який інший повноцінний рідний IDE.

Все, що вам потрібно зробити, це:

pip install jupyterlab
# if you use conda
conda install -c conda-forge jupyterlab
# to run 
jupyter lab    # instead of jupyter notebook

Ось скріншот із blog.Jupyter.org

Що я зазвичай роблю після нової установки - це змінити основний файл css, де зберігаються всі візуальні стилі. Я використовую Miniconda, але розташування схоже з іншимиC:\Miniconda3\Lib\site-packages\notebook\static\style\style.min.css

На деяких екранах ці роздільні здатності відрізняються і більше 1. Щоб бути безпечним, я змінюю все на 98%, тому якщо я відключаюсь від зовнішніх екранів на своєму ноутбуці, у мене все ще ширина екрана 98%.

Тоді просто замініть 1140px на 98% ширини екрана.

@media (min-width: 1200px) {
  .container {
    width: 1140px;
  }
}

Після редагування

@media (min-width: 1200px) {
  .container {
    width: 98%;
  }
}

Збережіть і перезавантажте ноутбук

Оновлення

Нещодавно довелося розширювати осередки Юпітера на середовищі, яке воно встановлено, що змусило мене повернутися сюди і нагадати про себе.

Якщо вам потрібно зробити це у віртуальній середовищі, ви встановили юпітер на. Ви можете знайти файл css у цьому підкаталозі

env/lib/python3.6/site-packages/notebook/static/style/stye.min.css

Ви можете встановити CSS ноутбука, зателефонувавши в таблицю стилів з будь-якої комірки. Як приклад, подивіться курс 12 кроків до Нав'є Стокса .

Зокрема, створення файлу, що містить

<style>
    div.cell{
        width:100%;
        margin-left:1%;
        margin-right:auto;
    }
</style>

повинен дати вам вихідну точку. Однак може знадобитися також коригування, наприклад, div.text_cell_renderдля вирішення питань розмітки, а також кодових комірок.

Якщо цей файл, custom.cssто додайте комірок, що містить:

from IPython.core.display import HTML
def css_styling():
    styles = open("custom.css", "r").read()
    return HTML(styles)
css_styling()

Це стосуватиметься всіх стилів, і, зокрема, змінить ширину комірок.

(Станом на 2018 рік, я б радив спробувати JupyterHub / JupyterLab. Він використовує повну ширину монітора. Якщо це не варіант, можливо, оскільки ви використовуєте одного з хмарних постачальників послуг Jupyter як послуга, продовжуйте читати)

(Стильного звинувачують у крадіжці даних користувачів. Я перейшов до використання плагіна Stylus)

Я рекомендую використовувати плагін для браузера Stylish . Таким чином ви можете перекрити css для всіх ноутбуків, не додаючи код до ноутбуків. Нам не подобається змінювати конфігурацію в .ipython / profile_default, оскільки ми використовуємо спільний сервер Jupyter для всієї команди, а ширина є перевагою користувача.

Я створив стиль спеціально для вертикально орієнтованих екранів з високою роздільною здатністю, що робить комірки ширшими та додає трохи порожнього простору в нижній частині, тому ви можете розташувати останню комірку в центрі екрана. https://userstyles.org/styles/131230/jupyter-wide Ви, звичайно, можете змінити мій css на свій смак, якщо у вас інший макет, або ви не хочете, щоб в кінцевому підсумку вийшло додаткове порожнє місце.

І останнє, але не менш важливе, Stylish - це чудовий інструмент, який можна використовувати у вашому наборі інструментів, оскільки ви можете легко налаштувати інші сайти / інструменти на свій смак (наприклад, Jira, Podio, Slack тощо)

@media (min-width: 1140px) {
  .container {
    width: 1130px;
  }
}

.end_space {
  height: 800px;
}

Для користувачів Chrome я рекомендую Stylebot , який дозволить вам замінити будь-який CSS на будь-якій сторінці, а також дозволить шукати та встановлювати інші користувацькі CSS. Однак для нашої мети нам не потрібна якась попередня тема. Відкрийте Stylebot, змініть на Edit CSS. Юпітер фіксує деякі натискання клавіш, тому ви не зможете ввести код нижче. Просто скопіюйте та вставте або просто ваш редактор:

#notebook-container.container {
    width: 90%;
}

Змініть ширину, як вам подобається, я вважаю, що 90% виглядає приємніше, ніж 100%. Але це повністю на ваш погляд.

Це код, який я в кінцевому підсумку використав. Він розтягує вхідні та вихідні комірки зліва та справа. Зверніть увагу, що індикація введення / виводу номера не буде:

from IPython.core.display import display, HTML
display(HTML("<style>.container { width:100% !important; }</style>"))
display(HTML("<style>.output_result { max-width:100% !important; }</style>"))
display(HTML("<style>.prompt { display:none !important; }</style>"))

Я вніс деякі зміни до рішення @ jvd10. "Важливо" здається занадто сильним, щоб контейнер не адаптувався добре, коли відображається бічна панель TOC. Я її видалив і додав 'min-width', щоб обмежити мінімальну ширину.

Ось мій .juyputer / custom / custom.css:

/* Make the notebook cells take almost all available width and limit minimal width to 1110px */
.container {
    width: 99%;
    min-width: 1110px;
}   

/* Prevent the edit cell highlight box from getting clipped;
 * important so that it also works when cell is in edit mode*/
div.cell.selected {
    border-left-width: 1px;
}

Я спробував усе, і для мене нічого не вийшло, я в кінцевому підсумку використовував показ мого кадру даних у вигляді HTML наступним чином

from IPython.display import HTML    
HTML (pd.to_html())

Для користувачів Firefox / Chrome приємним способом досягнення 100% ширини є використання користувацького сценарію TamperMonkey .

Переваги є

1. конфігуруйте це один раз у вашому браузері, не потрібно змінювати конфігурацію сервера.
2. працює з декількома серверами юпітера.
3. TamperMonkey надійний, підтримуваний та стабільний.
4. Безліч додаткових налаштувань можливі через javascript.

Цей сценарій працює для мене https://gist.githubusercontent.com/mrk-andreev/2a9c2538fad0b687c27e192d5948834f/raw/6aa1148573dc20a22fca126e56e3b03f4abf281b/jpn_tmonkey.js