Вставка изображения в разметку ноутбука IPython

217

Я начинаю сильно зависеть от приложения для ноутбука IPython при разработке и документировании алгоритмов. Это превосходно; но есть кое-что, что кажется возможным, но я не могу понять, как это сделать:

Я хотел бы вставить локальное изображение в мою (локальную) разметку ноутбука IPython, чтобы помочь в документировании алгоритма. Я знаю достаточно, чтобы добавить что-то вроде <img src="image.png">к уценке, но это все, что касается моих знаний. Я предполагаю, что мог бы поместить изображение в каталог, представленный 127.0.0.1:8888 (или в некоторый подкаталог), чтобы иметь к нему доступ, но я не могу понять, где находится этот каталог. (Я работаю над Mac.) Итак, возможно ли сделать то, что я пытаюсь сделать, без особых проблем?

— benpro
источник

201

Файлы внутри директории ноутбука доступны по ссылке «files /». Так что, если он находится в базовом пути, он будет <img src="files/image.png">доступен <img src="files/subdir/image.png">, и также доступны подкаталоги и т. Д.

Обновление : начиная с IPython 2.0 files/префикс больше не нужен (см. Примечания к выпуску ). Так что теперь решение <img src="image.png">просто работает, как и ожидалось.

— minrk
источник

3

Ах, вы, вероятно, используете 0,12, не так ли? Обслуживание локальных файлов в настоящее время доступно только в master. И да, «каталог записной книжки» - это каталог с записными книжками (файлы .ipynb).

— minrk

107

Так как вы в уценке, почему бы не использовать ![caption](files/image.png)?

— Кинан

4

@minrk: это не работает для меня. Я поставил "<img src =" k.png ">", но это ничего не показывает. k.png находится в той же папке, что и файл ноутбука.

— Абид Рахман К

4

Пожалуйста, перечитайте ответ и комментарии. Ваш URL всегда будет начинаться с 'files /', поэтому, если у вас есть k.pngрядом с вашей записной книжкой, URL будет src="files/k.png".

— Minrk

2

Вы должны обновить веб-страницу для изображений по указанному URL-адресу для перезагрузки.

— minrk

230

Большинство ответов, приведенных до сих пор, идут в неправильном направлении, предлагая загрузить дополнительные библиотеки и использовать код вместо разметки. В ноутбуках Ipython / Jupyter это очень просто. Убедитесь, что ячейка действительно находится в разметке, и для отображения изображения используйте:

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

Дополнительное преимущество по сравнению с другими предлагаемыми методами заключается в том, что вы можете отображать все распространенные форматы файлов, включая jpg, png и gif (анимации).

— Филипп Шварц
источник

Любопытно, как вы знаете эту команду. Это уникально для Jupyter или это какой-то язык (возможно, латексное форматирование), который вы используете в Jupyter для добавления изображения?

— Алекс Г

1

@ Alex G, Markdown - это язык с синтаксисом форматирования простого текста, разработанный для того, чтобы его можно было конвертировать в HTML и многие другие форматы. Markdown часто используется для создания форматированного текста с использованием текстового редактора. Проверьте следующую ссылку, чтобы узнать синтаксис: github.com/adam-p/markdown-here/wiki/Markdown-Cheatsheet

— Филипп Шварц

@PhilippSchwarz Есть ли в вашем примере несколько вариантов для управления размером вставляемого изображения? С помощью <img...>тега такие параметры выглядят примерно так <img ... width="480">.

— Reb.Cabin

1

Используя это не сработало. Записная книжка искала в определенном месте / notebooks / <мой рабочий путь добавлен здесь> - конечно, это не root - и локальный путь не существовал. Я нашел полезным использовать изображение для вставки в блокнот, которое добавляло изображение в качестве вложения (теперь оно переносное).

— Mark

2

Есть ли способ использовать этот метод с файлами изображений, в именах которых есть пробел?

— Зебралами

78

Я использую ipython 2.0, поэтому просто две строки.

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

— Gomes
источник

25

Это правильный способ отображения изображения в ячейке кода . Ответ minrk - правильный способ отображения изображения в ячейке уценки .

— Майк

3

Используя jupyter notebook 4.2.0, изображение не отображается, если я displayтоже не позвоню : from IPython.display import Image, display; display(Image(filename='output1.png'))

— Matteo T.

22

[Устаревшее]

IPython / Jupyter теперь поддерживает модули расширения, которые могут вставлять изображения с помощью копирования и вставки или перетаскивания.

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

Расширение drag & drop работает в большинстве браузеров

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

Но копирование и вставка работает только в Chrome.

— Майк
источник

1

Этот ответ требует некоторых голосов. Очень немногие знают о расширениях Ipython.

— Торан

только что попробовал drag'n'drop в Safari и Chrome, у меня не работает (OSX, Py3, все обновления)

— K.-Michael Aye

2

Вторая ссылка, которую вы разместили, не работает - расширение больше не поддерживается?

— zthomas.nc

Я также не могу найти расширение больше.

— yerforkferchips

Да, Jupyter немного продвинулся за последние три года, и этот ответ довольно устарел.

— Майк

18

Получение изображения в Jupyter NB - намного более простая операция, чем большинство людей упоминало здесь.

1) Просто создайте пустую ячейку Markdown. 2) Затем перетащите файл изображения в пустую ячейку Markdown.

Затем появится код уценки, который вставит изображение.

Например, строка, выделенная серым цветом ниже, появится в ячейке Jupyter:

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

3) Затем выполните ячейку Markdown, нажав Shift-Enter. Сервер Jupyter затем вставит изображение, и изображение появится.

Я использую сервер ноутбука Jupyter: 5.7.4 с Python 3.7.0 в Windows 7.

Это так просто!

— Рич Лысаковский PhD
источник

2

Это действительно лучшее решение, которое я нашел!

— GCGM

К сожалению, этот метод не работает, когда Jupyter Notebook версии 6.0 размещен в Google Cloud. У кого-нибудь есть обходной путь, который работает без прав администратора, что-то кроме установки перетаскивания nbextension?

— Рич Лысаковски доктор философии

13

Я положил записную книжку IPython в одну папку с изображением. Я использую Windows. Название изображения "phuong huong xac dinh.PNG".

В уценке:

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

Код:

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

— Гидромен
источник

1

ссылка на документацию ipython.readthedocs.io/en/stable/api/generated/… , хотя использование markdown ( ![alt text](foo.png "the title")желательно в imho, если не требуется использование дополнительных аргументов из api.

— Майкл

9

Сначала убедитесь, что вы находитесь в режиме редактирования уценки в ячейке записной книжки ipython.

Это альтернативный способ, предложенный другими <img src="myimage.png">:

![title](img/picture.png)

Это также, кажется, работает, если заголовок отсутствует:

![](img/picture.png)

Обратите внимание, что в пути не должно быть цитат. Не уверен, что это работает для путей с пробелами, хотя!

— tsando
источник

1

Для меня изображения с пробелами в имени не отображались в блокноте. Я удалил пробелы, я могу видеть сейчас.

— insanely_sin

9

Последняя версия ноутбука Jupyter принимает копирование / вставку изображения изначально

— Ромэн Жуан
источник

Я предпочитаю этот вариант, так как он встраивает изображение в двоичный файл ноутбука. Это делает ноутбук тяжелее, но вам не нужно держать изображение в относительном направлении.

— Тулио Казагранде

8

Если вы хотите отобразить изображение в ячейке Markdown, используйте:

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

Если вы хотите отобразить изображение в ячейке кода, используйте:

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

— seralouk
источник

В ячейке уценки, для меня, работает без запятых:<img src="files/image.png" width=800 height=400>

— aerijman

это правда, что запятые не нужны в командах HTML. см. мое обновление

— seralouk

5

Измените блок по умолчанию с «Code» на «Markdown» перед запуском этого кода:

![<caption>](image_filename.png)

Если файл изображения находится в другой папке, вы можете сделать следующее:

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

— Джейд Качо
источник

4

Для тех, кто ищет, где разместить файл изображения на компьютере Jupyter, чтобы его можно было показать из локальной файловой системы.

Я положил mypic.pngв

/root/Images/mypic.png

(это папка «Изображения», которая отображается в онлайн-браузере файлов Jupyter)

В этом случае мне нужно поместить следующую строку в ячейку «Markdown», чтобы моя картинка отображалась в блокноте:

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

— Сергей Щербаков
источник

2

Ответ Минрка правильный.

Однако я обнаружил, что изображения выглядят испорченными в режиме «Просмотр печати» (на моем компьютере с Windows, работающем с Anaconda, версия IPython версии 0.13.2 в браузере Chrome)

Обходной путь для этого должен был использовать <img src="../files/image.png"> вместо этого.

Это позволило правильно отобразить изображение как в режиме печати, так и в обычном режиме редактирования iPython.

ОБНОВЛЕНИЕ: с моего обновления до iPython v1.1.0 больше нет необходимости в этом обходном пути, так как представление печати больше не существует. Фактически, вы должны избегать этого обходного пути, поскольку он не позволяет инструменту nbconvert находить файлы.

— jlarchibald
источник

-3

Вы можете найти свой текущий рабочий каталог командой pwd в блокноте jupyter без кавычек.

— Номан Назир
источник