Tuesday, May 10, 2022

[FIXED] How to embed image or picture in jupyter notebook, either from a local machine or from a web resource?

Issue

I would like to include image in a jupyter notebook.

If I did the following, it works :

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

But I would like to include the images in a markdown cell and the following code gives a 404 error :

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

I also tried

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

But I still get the same 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

Solution

You mustn't use quotation marks around the name of the image files in markdown!

If you carefully read your error message, you will see the two %22 parts in the link. That is the html encoded quotation mark.

You have to change the line

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

to

![title](img/picture.png)

UPDATE

It is assumed, that you have the following file structure and that you run the jupyter notebook command in the directory where the file example.ipynb (<-- contains the markdown for the image) is stored:

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


Answered By - Sebastian Stigler
Answer Checked By - Cary Denson (PHPFixing Admin)

No comments:

Post a Comment

Note: Only a member of this blog may post a comment.