브라우저에서 Jupyter / ipython 노트북의 셀 너비를 늘리려면 어떻게합니까?


350

브라우저에서 ipython 노트북의 너비를 늘리고 싶습니다. 고해상도 화면이 있으며이 여분의 공간을 사용하기 위해 셀 너비 / 크기를 확장하고 싶습니다.

감사!


편집 : 5/2017

나는 이제 jupyterthemes를 사용합니다 : https://github.com/dunovank/jupyter-themes

이 명령은

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

멋진 테마로 너비를 100 %로 설정합니다.


1
시도의 np.set_printoptions (250)
— vgoklani

2
감사! np.set_printoptions(linewidth=110)나를 위해 작동합니다.
— Timo

1
@vgoklani 죄송하지만 'np'? 어디에서 왔습니까?
— Brandt

1
@Brandt import numpy as np
— vgoklani

3
Jupyter 테마의 경우 @vgoklani +1
— Gursharan Singh

답변:


615

기본 설정을 변경하지 않고 작업중인 현재 전자 필기장의 너비 만 변경하려는 경우 셀에 다음을 입력 할 수 있습니다.

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

11
좋은. 코드 / 마크 다운 셀 만 변경하는 것처럼 보입니다. 출력 셀을 수행하는 방법이 있습니까?
— dreyco676

13
이 솔루션은 저에게 효과적이었습니다! 사용하기 위해 lib 또는 패키지를 설치할 필요가 없었습니다.
— Bill Ancalagon the black

1
Julia에 Jupyter를 사용하고 있습니다. 이 경우에 내가 필요한 것을 알고 있습니까?
— becko

68
이것은 내 인생을 바꿨습니다
— YellowPillow

1
줄리아 담화 에 따르면 @becko 이것은 작동합니다 :display("text/html", "<style>.container { width:100% !important; }</style>")
— Liso

210

이 div.cell솔루션은 실제로 내 IPython에서 작동하지 않았지만 다행히도 누군가가 새로운 IPython을위한 작동 솔루션을 제안했습니다.

컨텐츠 가 포함 된 파일 ~/.ipython/profile_default/static/custom/custom.css(iPython) 또는 ~/.jupyter/custom/custom.css(Jupyter) 생성

.container { width:100% !important; }

그런 다음 iPython / Jupyter 노트북을 다시 시작하십시오. 이것은 모든 노트북에 영향을 미칩니다.


5
이 작은 정보 스 니펫은 어느 곳에 게시해야합니다. 다시 한 번 감사드립니다!
— vgoklani

4
이것은 매우 유용했습니다
— ivrin

13
IPython 4.1 시작 사용자 정의 폴더 위치가로 변경되었습니다 ~/.jupyter/custom/.
— Romain

6
Jupyter 노트북 (4.1.0)을 다시 시작해야 작동했습니다. 위의 CSS를 넣었습니다.~/.jupyter/custom/custom.css
— Paul

6
100 %는보기에 좋지 않습니다. 90 %로 변경했습니다.
— liang

69

이것을 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;
}

이것은 리눅스에서 작동합니다! 그러나 Windows에서 파일을 어디에 저장해야합니까?
— 십자군

6
을 실행 jupyter --config-dir한 다음 custom\custom.css명령이 반환하는 위치에 만듭니다 .
— jvd10

@ jvd10 이것은 나를 위해 작동하지 않았습니다. 않습니다 custom.css위의 조각 이외의 다른 코드가? 또한 Jupyter는 그것을 어떻게 사용하는지 알고 있습니까?
— mLstudent33

리눅스와 osx에서 최소한 jupyter는 기본적으로 위와 .jupyter같은 사용자 정의를 포함하여 구성 파일을 요구하는 숨겨진 디렉토리를 찾습니다 . 위의 내용은 custom.css의 유일한 내용이어야합니다. 더 자세한 정보는 여기를 참조하십시오 : jupyter.readthedocs.io/en/latest/projects/…
— jvd10

24

jupyterlab 을 사용할 때입니다

마지막으로 노트북에 대한 업그레이드가 필요했습니다. 기본적으로 다른 본격적인 기본 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의 스크린 샷입니다.


2
JupyterLab은 아직 베타 버전이며 일반 전자 필기장 (디자인에 따라)에서 약간의 회귀가 있습니다. 주목할만한 것은 기본적으로 JS를 금지하고 모든 작은 JS 시각화를위한 확장이 필요하다는 것입니다.
— Ciprian Tomoiagă

1
Jupyter Lab 셀의 너비를 어떻게 변경할 수 있습니까?
— multigoodverse

1
Jupyter Lab을 작동시키기 위해 한 시간 동안 어려움을 겪었습니다. 처음에는 그래픽 (pyplot / plotly)이 표시되지 않았습니다. 문서에는 해당 확장을 설치해야한다고 언급하지 않았습니다. 음모 확장 프로그램을 설치하려고했습니다. 그에 대한 nodejs가 필요하다는 것을 알았습니다. 둘 다 설치되면 "템플릿을 찾을 수 없습니다 :"index.html ""메시지가 나타납니다. 내가 포기한 시점에서 나는 주피터 노트를 가지고있다.
— Itamar Katz

15

새로 설치 한 후 일반적으로하는 일은 모든 비주얼 스타일이 저장된 기본 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%;
  }
}

여기에 이미지 설명을 입력하십시오 노트북 저장 후 다시 시작


최신 정보

최근 Jupyter 셀이 설치된 환경에서 Jupyter 셀을 넓혀야했기 때문에 여기로 돌아와서 다시 생각 나게했습니다.

가상 환경에서 해야하는 경우 jupyter를 설치했습니다. 이 하위 디렉토리에서 CSS 파일을 찾을 수 있습니다

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

1
대단해! 간단하고 필요한 것을 정확하게 달성합니다.
— arbitrarystringofletters

@Gunay /notebook가 디렉토리에 없습니다.
— mLstudent33

파이썬의 버전 (환경을 활성화 할 때 Python -V)과 가상 환경을 어떻게 만들었습니까? Python / Conda에서 venv 모듈을 사용 했습니까?
— Gunay Anach

12

모든 셀에서 스타일 시트를 호출하여 노트북의 CSS를 설정할 수 있습니다. 예를 들어, Navier Stokes 의 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()

모든 스타일을 적용하고 특히 셀 너비를 변경합니다.


최신 IPython (버전> 2)에서는 작동하지 않습니다. 이 답변을 확인하십시오 : stackoverflow.com/a/24207353/2108548
— rominf

또는 최근 ipython 및 jupyter에서 현재 노트북으로 변경하려면 @jjinking의 답변 :)을 참조하십시오.
— nealmcb

8

(2018 년 현재 JupyterHub / JupyterLab을 사용해 보는 것이 좋습니다. 모니터의 전체 너비를 사용합니다. 이것이 옵션이 아닌 경우 클라우드 기반 Jupyter-as-a-Service 서비스 제공 업체 중 하나를 사용하고 있기 때문에, 계속 읽으세요)

(스타일리쉬는 사용자 데이터를 훔친 것으로 비난받습니다. 대신 스타일러스 플러그인을 사용했습니다.)

Stylish Browser Plugin 사용을 권장 합니다. 이 방법으로 노트북에 코드를 추가하지 않고도 모든 노트북의 CSS를 재정의 할 수 있습니다. 팀 전체에 대해 공유 Jupyter 서버를 실행하고 너비는 사용자 기본 설정이므로 .ipython / profile_default에서 구성을 변경하지 않습니다.

세로 방향의 고해상도 화면을 위해 특별히 스타일을 지정하여 셀을 넓히고 아래쪽에 빈 공간을 추가하여 마지막 셀을 화면 중앙에 배치 할 수 있습니다. https://userstyles.org/styles/131230/jupyter-wide 물론 다른 레이아웃이 있거나 끝에 빈 공간을 원하지 않으면 CSS를 원하는대로 수정할 수 있습니다.

마지막으로, Stylish는 다른 사이트 / 도구를 원하는대로 쉽게 사용자 정의 할 수 있으므로 (예 : Jira, Podio, Slack 등) 도구 세트에 포함 할 수있는 훌륭한 도구입니다.

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

.end_space {
  height: 800px;
}

예, 스타일리쉬는 훌륭합니다! 하단에 여분의 공간에 필요한 코드를 추가 할 수 있습니까? 실제 마지막 셀을 중심으로 -_- 시키려면 항상 빈 줄이 많은 빈 셀이 있습니다.
— Ciprian Tomoiagă


6

Chrome 사용자 는 모든 페이지의 CSS를 재정의하고 다른 공유 사용자 정의 CSS를 검색하고 설치할 수있는 Stylebot을 권장 합니다. 그러나 우리의 목적을 위해 사전 테마가 필요하지 않습니다. Stylebot을 열고로 변경하십시오 Edit CSS. Jupyter는 일부 키 입력을 캡처하므로 아래 코드를 입력 할 수 없습니다. 복사하여 붙여 넣기 또는 편집기 만 :

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

원하는대로 너비를 변경하면 90 %가 100 %보다 좋아 보입니다. 그러나 그것은 당신의 눈에 달려 있습니다.


jupyter 노트북에 대한 멋진 제안이지만 훨씬 더 많은 일을합니다!
— Robino

@bizi, 코드 셀 내부를 클릭 한 다음 마우스 오른쪽 버튼을 클릭하고 Stylebot을 선택하고 CSS를 편집하고 가지고있는 것을 복사하여 붙여 넣습니까? 그렇다면 그것은 나를 위해 작동하지 않았습니다. 방금 양쪽에 더 마진이 생겼습니다.
— mLstudent33

4

이것은 내가 사용한 코드입니다. 입력 및 출력 셀을 왼쪽 및 오른쪽으로 늘입니다. 입 / 출력 번호 표시가 사라집니다.

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>"))

멋있는! 이 세포 실행 정보가 사라질 수 있기 때문에 나는 마지막 라인을 제외 것 (세포, 부분 왼쪽이 보여 excecution 순서와 실행이 아직 완료되지 않은 *)
— onofricamila

2

@ jvd10의 솔루션을 수정했습니다. '! 중요'는 TOC 사이드 바가 표시 될 때 컨테이너가 잘 적응되지 않을 정도로 너무 강해 보입니다. 나는 그것을 제거하고 최소 너비를 제한하기 위해 '최소 너비'를 추가했습니다.

내 .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;
}

0

나는 모든 것을 시도했지만 아무것도 효과가 없었습니다. 내 데이터 프레임을 HTML로 표시하여 다음과 같이 끝냈습니다.

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

-1

Firefox / Chrome 사용자의 경우 100 % 너비를 달성하는 좋은 방법은 사용자 정의 TamperMonkey 스크립트 를 사용하는 것 입니다.

장점은

  1. 브라우저에서 한 번만 구성하면 서버 구성을 수정할 필요가 없습니다.
  2. 여러 jupyter 서버와 함께 작동합니다.
  3. TamperMonkey는 신뢰할 수 있고 유지 관리되며 안정적입니다.
  4. 자바 스크립트를 통해 많은 추가 사용자 정의가 가능합니다.

이 스크립트는 나를 위해 작동 https://gist.githubusercontent.com/mrk-andreev/2a9c2538fad0b687c27e192d5948834f/raw/6aa1148573dc20a22fca126e56e3b03f4abf281b/jpn_tmonkey.js

당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.