Chèn hình ảnh vào đánh dấu máy tính xách tay IPython


216

Tôi bắt đầu phụ thuộc rất nhiều vào ứng dụng máy tính xách tay IPython để phát triển và thuật toán tài liệu. Thật là tuyệt vời; nhưng có một cái gì đó có vẻ như là có thể, nhưng tôi không thể tìm ra cách để làm điều đó:

Tôi muốn chèn một hình ảnh cục bộ vào đánh dấu máy tính xách tay IPython (cục bộ) của tôi để hỗ trợ cho việc ghi lại một thuật toán. Tôi biết đủ để thêm một cái gì đó giống như <img src="image.png">đánh dấu, nhưng đó là về kiến ​​thức của tôi. Tôi giả sử tôi có thể đặt hình ảnh trong thư mục được đại diện bởi 127.0.0.1:8888 (hoặc một số thư mục con) để có thể truy cập nó, nhưng tôi không thể tìm ra thư mục đó ở đâu. (Tôi đang làm việc trên máy mac.) Vì vậy, có thể làm những gì tôi đang cố gắng thực hiện mà không gặp quá nhiều khó khăn không?

Câu trả lời:


200

Các tệp bên trong thư mục sổ ghi chép có sẵn dưới một url "tệp /". Vì vậy, nếu nó nằm trong đường dẫn cơ sở, nó sẽ có <img src="files/image.png">, và các thư mục con, v.v. cũng có sẵn : <img src="files/subdir/image.png">, v.v.

Cập nhật : bắt đầu với IPython 2.0, files/tiền tố không còn cần thiết nữa (xem ghi chú phát hành ). Vì vậy, bây giờ giải pháp <img src="image.png">đơn giản là làm việc như mong đợi.


3
Ah, có lẽ bạn đang sử dụng 0.12, phải không? Phục vụ các tệp cục bộ hiện chỉ có sẵn trong tổng thể. Và vâng, "thư mục notebook" là thư mục chứa các notebook (tập tin .ipynb).
minrk

107
Vì bạn đang trong markdown, tại sao không sử dụng ![caption](files/image.png)?
kynan

4
@minrk: nó không hoạt động với tôi. Tôi đặt "<img src =" k.png ">", nhưng nó không hiển thị gì cả. k.png nằm trong cùng thư mục với tệp của sổ ghi chép.
Abid Rahman K

4
Xin vui lòng đọc lại câu trả lời và ý kiến. Url của bạn sẽ luôn bắt đầu bằng 'tệp /', vì vậy nếu bạn có k.pngbên cạnh sổ ghi chép của mình, URL sẽ là src="files/k.png".
minrk

2
bạn phải làm mới một trang web cho hình ảnh tại một url nhất định để được tải lại.
tối thiểu

229

Hầu hết các câu trả lời được đưa ra cho đến nay đều đi sai hướng, đề nghị tải thêm thư viện và sử dụng mã thay vì đánh dấu. Trong Ipython / Jupyter Notebooks rất đơn giản. Đảm bảo ô thực sự được đánh dấu và để hiển thị hình ảnh sử dụng:

![alt text](imagename.png "Title")

Lợi thế hơn nữa so với các phương pháp khác được đề xuất là bạn có thể hiển thị tất cả các định dạng tệp phổ biến bao gồm jpg, png và gif (hình động).


Tò mò về cách bạn biết lệnh này. Nó là duy nhất đối với Jupyter hay đây là một số ngôn ngữ (định dạng latex, có lẽ) mà bạn đang sử dụng trong Jupyter để thêm hình ảnh?
Alex G

1
@ Alex G, Markdown là ngôn ngữ với cú pháp định dạng văn bản đơn giản được thiết kế để có thể chuyển đổi sang HTML và nhiều định dạng khác. Markdown thường được sử dụng để tạo văn bản có định dạng bằng trình soạn thảo văn bản thuần túy. Kiểm tra liên kết sau để tìm hiểu cú pháp: github.com/adam-p/markdown-here/wiki/Markdown-Chcoateet
Philipp Schwarz

@PhilippSchwarz có một số tùy chọn cho ví dụ của bạn ở trên để kiểm soát kích thước của hình ảnh 'dán'? Sử dụng <img...>thẻ, các tùy chọn như vậy xuất hiện khoảng như thế này <img ... width="480">.
Reb.Cabin

1
Sử dụng nó không hoạt động. Notebook đang tìm kiếm ở một vị trí / sổ ghi chép cụ thể / <đường dẫn làm việc của tôi được nối ở đây> - chắc chắn đây không phải là root - và đường dẫn cục bộ không tồn tại. Tôi thấy hữu ích khi chỉ sử dụng hình ảnh chèn sổ ghi chép - đã thêm hình ảnh dưới dạng tệp đính kèm (hiện có thể mang theo).
Đánh dấu

2
Có cách nào để sử dụng phương pháp này với các tệp hình ảnh có khoảng trắng trong tên của chúng không?
zebralamy

78

Tôi đang sử dụng ipython 2.0, vì vậy chỉ cần hai dòng.

from IPython.display import Image
Image(filename='output1.png')

25
Đây là cách chính xác để hiển thị một hình ảnh trong một ô . câu trả lời minrk là cách chính xác để hiển thị một hình ảnh trong một markdown tế bào.
Mike

3
Sử dụng máy tính xách tay jupyter 4.2.0, nó không hiển thị hình ảnh trừ khi tôi gọi displayquá: from IPython.display import Image, display; display(Image(filename='output1.png'))
Matteo T.

21

[Lỗi thời]

IPython / Jupyter hiện có hỗ trợ cho các mô-đun mở rộng có thể chèn hình ảnh thông qua sao chép và dán hoặc kéo và thả.

https://github.com/ipython-contrib/IPython-notebook-extensions

Tiện ích mở rộng kéo và thả dường như hoạt động trong hầu hết các trình duyệt

https://github.com/ipython-contrib/IPython-notebook-extensions/tree/master/nbextensions/usability/dragdrop

Nhưng sao chép và dán chỉ hoạt động trong Chrome.


1
Câu trả lời này cần một số upvote. Rất ít người biết về phần mở rộng Ipython.
Thoran

vừa thử drag'n'drop trong Safari và Chrome, không hoạt động với tôi (OSX, Py3, tất cả các bản cập nhật)
K.-Michael Aye

2
Liên kết thứ hai bạn đăng bị hỏng - tiện ích mở rộng không còn được hỗ trợ?
zthomas.nc

Tôi cũng không thể tìm thấy phần mở rộng nữa.
yerforkferchips

Vâng, Jupyter đã chuyển sang một chút trong ba năm qua và câu trả lời này khá lỗi thời.
Mike

17

Đưa hình ảnh vào Jupyter NB là một thao tác đơn giản hơn nhiều so với hầu hết mọi người đã ám chỉ ở đây.

1) Đơn giản chỉ cần tạo một ô Markdown trống. 2) Sau đó kéo và thả tệp hình ảnh vào ô Markdown trống.

Mã Markdown sẽ chèn hình ảnh sau đó xuất hiện.

Ví dụ: một chuỗi được hiển thị màu xám bên dưới sẽ xuất hiện trong ô Jupyter:

![Venus_flytrap_taxonomy.jpg](attachment:Venus_flytrap_taxonomy.jpg)

3) Sau đó thực hiện ô Markdown bằng cách nhấn Shift-Enter. Sau đó, máy chủ Jupyter sẽ chèn hình ảnh và hình ảnh sẽ xuất hiện.

Tôi đang chạy máy chủ máy tính xách tay Jupyter là: 5.7.4 với Python 3.7.0 trên Windows 7.

Điều này thật đơn giản !!


2
Đây thực sự là giải pháp tốt nhất mà tôi đã tìm thấy !!
GCGM

Thật không may, phương pháp này không hoạt động khi Jupyter Notebook phiên bản 6.0 được lưu trữ trong Google Cloud. Bất cứ ai cũng có một cách giải quyết hoạt động mà không có đặc quyền của Quản trị viên, ngoài việc cài đặt nbextension kéo và thả?
Rich Lysakowski Tiến sĩ

13

Tôi đặt máy tính xách tay IPython trong cùng một thư mục với hình ảnh. Tôi sử dụng Windows. Tên hình ảnh là "phuong huong xac dinh.PNG".

Trong Markdown:

<img src="phuong huong xac dinh.PNG">

Mã số:

from IPython.display import Image
Image(filename='phuong huong xac dinh.PNG')

1
tài liệu tham khảo ipython.readthedocs.io/en/urdy/api/generated/ , mặc dù sử dụng markdown ( ![alt text](foo.png "the title")là imho thích hợp hơn, trừ khi sử dụng các đối số bổ sung từ api là bắt buộc.
michael

9

Trước tiên, hãy đảm bảo bạn đang ở trong mô hình chỉnh sửa markdown trong ô máy tính xách tay ipython

Đây là một cách khác để phương pháp được đề xuất bởi người khác <img src="myimage.png">:

![title](img/picture.png)

Nó cũng có vẻ hoạt động nếu thiếu tiêu đề:

![](img/picture.png)

Lưu ý không có trích dẫn nên trong đường dẫn. Không chắc chắn nếu điều này làm việc cho các đường dẫn với khoảng trắng mặc dù!


1
Đối với tôi, hình ảnh với khoảng trắng trong tên không được hiển thị trong sổ ghi chép. Tôi loại bỏ các khoảng trống, tôi có thể nhìn thấy bây giờ.
insanely_sin

9

Phiên bản cuối cùng của máy tính xách tay jupyter chấp nhận sao chép / dán hình ảnh nguyên bản


Tôi thích tùy chọn này, vì nó nhúng hình ảnh vào nhị phân sổ ghi chép. Nó làm cho máy tính xách tay nặng hơn, nhưng bạn không cần phải giữ hình ảnh trong đường dẫn tương đối.
Tulio Casagrande

8

Nếu bạn muốn hiển thị hình ảnh trong một ô Markdown thì hãy sử dụng:

<img src="files/image.png" width="800" height="400">

Nếu bạn muốn hiển thị hình ảnh trong một ô Mã thì hãy sử dụng:

from IPython.display import Image
Image(filename='output1.png',width=800, height=400)

Trong ô đánh dấu, đối với tôi, hoạt động mà không có dấu phẩy:<img src="files/image.png" width=800 height=400>
aerijman

đúng là dấu phẩy không cần thiết trong các lệnh HTML. xem cập nhật của tôi
seralouk

5

Thay đổi khối mặc định từ "Mã" thành "Đánh dấu" trước khi chạy mã này:

![<caption>](image_filename.png)

Nếu tệp hình ảnh nằm trong một thư mục khác, bạn có thể làm như sau:

![<caption>](folder/image_filename.png)

4

Đối với những người đang tìm nơi đặt tệp hình ảnh trên máy Jupyter để nó có thể được hiển thị từ hệ thống tệp cục bộ.

Tôi đặt tôi mypic.pngvào

/root/Images/mypic.png

(đó là thư mục Hình ảnh hiển thị trong trình duyệt tệp trực tuyến Jupyter)

Trong trường hợp đó, tôi cần đặt dòng sau vào ô Markdown để hiển thị pic của mình trong notepad:

![My Title](Images/mypic.png)

2

Câu trả lời của minrk là đúng.

Tuy nhiên, tôi thấy rằng các hình ảnh dường như bị hỏng trong Chế độ xem In (trên máy Windows của tôi đang chạy bản phân phối Anaconda của phiên bản IPython 0.13.2 trong trình duyệt Chrome)

Cách giải quyết cho việc này là sử dụng <img src="../files/image.png">thay thế.

Điều này làm cho hình ảnh xuất hiện chính xác trong cả Chế độ xem In và chế độ xem chỉnh sửa iPython bình thường.

CẬP NHẬT: kể từ khi tôi nâng cấp lên iPython v1.1.0, không cần thêm cách khắc phục này vì chế độ xem in không còn tồn tại. Trong thực tế, bạn phải tránh cách giải quyết này vì nó ngăn công cụ nbconvert tìm các tệp.


-3

Bạn có thể tìm thấy thư mục làm việc hiện tại của mình bằng lệnh 'pwd' trong sổ ghi chép jupyter mà không có dấu ngoặc kép.

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.