Как встроить изображение или картинку в блокнот Jupyter, либо с локальной машины, либо с веб-ресурса?

Ответ 1

Вы не должны использовать кавычки вокруг имени файлов изображений в уценке!

Если вы внимательно прочитаете свое сообщение об ошибке, вы увидите две части %22 в ссылке. Это кавычка в кодировке html.

Вы должны изменить линию

![title]("img/picture.png")

в

![title](img/picture.png)

ОБНОВИТЬ

Предполагается, что у вас следующая файловая структура и что вы запускаете команду jupyter notebook в каталоге, где хранится файл example.ipynb (<- содержит уценку для изображения):

/
+-- example.ipynb
+-- img
    +-- picture.png

Ответ 2

Есть несколько способов разместить изображение в блокнотах Jupyter:

через HTML:

from IPython.display import Image
from IPython.core.display import HTML 
Image(url= "http://my_site.com/my_picture.jpg")

Вы сохраняете возможность использовать HTML-теги для изменения размера и т.д.

Image(url= "http://my_site.com/my_picture.jpg", width=100, height=100)

Вы также можете отображать изображения, хранящиеся локально, либо по относительному, либо по абсолютному пути.

PATH = "/Users/reblochonMasque/Documents/Drawings/"
Image(filename = PATH + "My_picture.jpg", width=100, height=100)

если изображение оно шире настроек дисплея: спасибо

используйте unconfined=True чтобы отключить unconfined=True максимальной ширины изображения

from IPython.core.display import Image, display
display(Image('https://i.ytimg.com/vi/j22DmsZEv30/maxresdefault.jpg', width=1900, unconfined=True))

или через уценку:

(убедитесь, что ячейка является ячейкой уценки, а не ячейкой кода, спасибо @游 凯 超 в комментариях)

для веб-изображения:

![Image of Yaktocat](https://octodex.github.com/images/yaktocat.png)

как показано @cristianmtr Обратите внимание, чтобы не использовать ни эти кавычки "" ни те, '' вокруг URL.

или локальный:

![title](img/picture.png)

продемонстрировано @Sebastian

Ответ 3

В качестве альтернативы вы можете использовать простой HTML <img src>, который позволяет изменять высоту и ширину и по-прежнему считываться интерпретатором уценки:

<img src="subdirectory/MyImage.png",width=60,height=60>

Ответ 4

Я удивлен, что никто здесь не упомянул опцию html cell magic. из docs (IPython, но тот же для Jupyter)

%% HTML

Render the cell as a block of HTML

Ответ 5

В дополнение к другим ответам, используя HTML (либо в Markdown, либо используя %%HTML magic:

Если вам нужно указать высоту изображения, это не будет работать:

<img src="image.png" height=50> <-- will not work

Это связано с тем, что CSS-стиль в Jupyter использует height: auto по умолчанию для тегов img, который переопределяет атрибут высоты HTML. Вам нужно переписать атрибут CSS height вместо этого:

<img src="image.png" style="height:50px"> <-- works

Ответ 6

Я знаю, что это не совсем актуально, но так как этот ответ занимает первое место много раз при поиске "как отображать изображения в Jupyter", пожалуйста, рассмотрите этот ответ также.

Вы можете использовать matplotlib, чтобы показать изображение следующим образом.

import matplotlib.pyplot as plt
import matplotlib.image as mpimg
image = mpimg.imread("your_image.png")
plt.imshow(image)
plt.show()

Ответ 7

Здесь вы можете сделать это с помощью Markdown:

![Image of Yaktocat](https://octodex.github.com/images/yaktocat.png)

Ответ 8

Если вы хотите использовать Jupyter Notebook API (а не IPython), я нахожу ipywidgets подпроект Jupyter, У вас есть виджет Image. Docstring указывает, что у вас есть параметр value, который является байтом. Итак, вы можете сделать:

import requests
from ipywidgets import Image

Image(value=requests.get('https://octodex.github.com/images/yaktocat.png').content)

Согласен, проще использовать стиль Markdown. Но он показывает вам API-интерфейс Note Display. Вы также можете изменить размер изображения с помощью параметров width и height.

Ответ 9

Вот решение для Jupyter и Python3:

Я поместил свои изображения в папку с именем ImageTest. Мой каталог:

C:\Users\MyPcName\ImageTest\image.png

Чтобы показать изображение, я использовал это выражение:

![title](/notebooks/ImageTest/image.png "ShowMyImage")

Также следите за / и \

Ответ 10

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

![](files/picture.png)

Ответ 11

Вставьте изображение прямо в блокнот Jupyter.

Примечание. На вашем компьютере должна быть локальная копия изображения

.Вы можете вставить изображение в блокнот Jupyter. Таким образом, вам не нужно хранить изображение отдельно в папке.

Шаги:

1. Преобразовать ячейку в markdown с помощью:

   • нажав M на выбранной ячейке
     ИЛИ
     
   • В строке меню выберите Ячейка> Тип ячейки> Уценка.
     (Примечание: Важно преобразовать ячейку в Markdown, иначе параметр "Вставить изображение" в шаге 2 не будет активен)

2. Теперь перейдите в строку меню и выберите "Правка" → "Вставить изображение".

3. Выберите изображение с вашего диска и загрузите.

4. Нажмите Ctrl + Enter или Shift + Enter.

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

Ответ 12

Я обнаружил, что путь к вашему изображению должен быть относительно того места, откуда изначально была загружена записная книжка. если вы перейдете в другой каталог, такой как Pictures, ваш путь Markdown будет по-прежнему относительно исходного каталога загрузки.

Ответ 13

При работе с программными пакетами, которые я хотел бы продемонстрировать, я использую редактор Snagit, чтобы комментировать скриншот, затем копирую и вставляю изображение непосредственно из редактора в Jupyter...