Cómo incluir una imagen en jupyter notebook


Me gustaría incluir una imagen en un cuaderno de jupyter.

Si hice lo siguiente, funciona :

from IPython.display import Image
Image("img/picture.png")

Pero me gustaría incluir las imágenes en una celda de markdown y el siguiente código da un error 404:

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

También intenté

![texte]("http://localhost:8888/img/picture.png")

Pero todavía tengo el mismo error :

404 GET /notebooks/%22/home/user/folder/img/picture.png%22 (127.0.0.1) 2.74ms referer=http://localhost:8888/notebooks/notebook.ipynb
Author: Reblochon Masque, 2015-09-03

9 answers

¡No debe usar comillas alrededor del nombre de los archivos de imagen en markdown!

Si lee cuidadosamente su mensaje de error, verá las dos partes %22 en el enlace. Esa es la comilla codificada en html.

Tienes que cambiar la línea

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

A

![title](img/picture.png)

ACTUALIZACIÓN

Se asume que tiene la siguiente estructura de archivos y que ejecuta el comando jupyter notebook en el directorio donde el archivo example.ipynb (

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

 154
Author: Sebastian Stigler,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-07-30 17:12:27

Hay varias maneras de publicar una imagen en Jupyter notebooks:

A través de HTML:

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

Conserva la capacidad de usar etiquetas HTML para cambiar el tamaño, etc...

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

También puede mostrar imágenes almacenadas localmente, ya sea a través de la ruta relativa o absoluta.

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

Si la imagen es más ancha que la configuración de visualización: gracias

Use unconfined=True para desactivar el confinamiento de ancho máximo de la imagen

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

O a través de markdown:

(asegúrese de la celda es una celda de descuento, y no una celda de código, gracias @ @ en los comentarios)

Para una imagen web:

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

Como muestra @cristianmtr Prestando atención a no usar estas comillas "" o aquellas '' alrededor de la url.

O uno local:

![title](img/picture.png)

Demostrado por @ Sebastian

 109
Author: Reblochon Masque,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-07-31 13:03:01

Alternativamente, puede usar un HTML simple <img src>, que le permite cambiar la altura y el ancho y aún así es leído por el intérprete markdown:

<img src="subdirectory/MyImage.png",width=60,height=60>
 39
Author: Alistair,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-06-08 22:21:03

Así es como puedes hacerlo con Markdown:

![Image of Yaktocat](https://octodex.github.com/images/yaktocat.png)
 9
Author: cristianmtr,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-09-03 08:29:41

Si quieres usar la API de Jupyter Notebook (y ya no la de IPython), encuentro el subproyecto de Jupyter ipywidgets. Tienes un widget Image. Docstring especifica que tiene un parámetro value que es un byte. Así que puedes hacer:

import requests
from ipywidgets import Image

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

Estoy de acuerdo, es más sencillo usar el estilo Markdown. Pero le muestra la API de Notebook de visualización de imágenes. También puede cambiar el tamaño de la imagen con los parámetros width y height.

 8
Author: dag,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-01-26 23:23:25

Me sorprende que nadie aquí haya mencionado la opción html cell magic. de la docs (IPython, pero lo mismo para Jupyter)

% % html

Render the cell as a block of HTML
 8
Author: Malik A. Rumi,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-10-22 16:19:45

Aquí es una Solución para Jupyter y Python3:

Puse mis imágenes en una carpeta llamada ImageTest. Mi directorio es:

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

Para mostrar la imagen usé esta expresión:

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

También mirar hacia fuera para / y \

 4
Author: BlindSide,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-03-27 22:30:23

Esto funciona para mí en una celda de descuento. De alguna manera no necesito mencionar específicamente si es una imagen o un simple archivo.

![](files/picture.png)
 3
Author: Pranav Pandit,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-12-06 23:39:21

Además de las otras respuestas usando HTML (ya sea en Markdown o usando la magia %%HTML:

Si necesita especificar la altura de la imagen, esto no funcionará:

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

Esto se debe a que el estilo CSS en Jupyter usa height: auto por defecto para las etiquetas img, que anula el atributo HTML height. Necesitas sobrescribir el atributo CSS height en su lugar:

<img src="image.png" style="height:50px"> <-- works
 3
Author: Haffael,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2018-01-16 20:16:08