我想包括在木星笔记本图像。
如果我做了以下操作，它就会起作用:
from IPython.display import Image
Image("img/picture.png")
但我想包括在markdown单元格和下面的代码给出一个404错误的图像:
![title]("img/picture.png")
我也试过
![texte]("http://localhost:8888/img/picture.png")
但我仍然得到相同的错误:
404 GET /notebooks/%22/home/user/folder/img/picture.png%22 (127.0.0.1) 2.74ms referer=http://localhost:8888/notebooks/notebook.ipynb
当前回答
我知道这不是完全相关的，但由于这个答案是第一次当你搜索“如何显示图像在Jupyter”，请考虑这个答案。
您可以使用matplotlib显示如下所示的图像。
import matplotlib.pyplot as plt
import matplotlib.image as mpimg
image = mpimg.imread("your_image.png")
plt.imshow(image)
plt.show()
其他回答
或者，你可以使用一个普通的HTML <img src>，它允许你改变高度和宽度，并且仍然被markdown解释器读取:
<img src="subdirectory/MyImage.png" width=60 height=60 />
虽然上面的很多答案都给出了使用文件或Python代码嵌入图像的方法，但有一种方法只使用markdown和base64就可以在jupyter笔记本中嵌入图像!
要在浏览器中查看图像，base64编码的png图像可以访问链接data:image/png;base64，**image data here**， base64，**image data here**， base64，**image data here**。在答案的末尾可以找到一个示例链接。
要将其嵌入到markdown页面中，只需使用与文件答案类似的构造，但使用base64链接:。现在你的图像是100%嵌入到你的Jupyter笔记本文件!
链接示例:data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAABHNCSVQICAgIfAhkiAAAAD9JREFUGJW1jzEOADAIAqHx/1+mE4ltNXEpI3eJQknCIGsiHSLJB+aO/06PxOo/x2wBgKR2jCeEy0rOO6MDdzYQJRcVkl1NggAAAABJRU5ErkJggg==
减价示例: !(微笑)(数据:图像/ png; base64, iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs + 9 aaaabhncsvqicagifahkiaaaad9jrefugjw1jzeoadaiaqhx / 1 + mE4ltNXEpI3eJQknCIGsiHSLJB + aO / 06 pxoo / x2wBgKR2jCeEy0rOO6MDdzYQJRcVkl1NggAAAABJRU5ErkJggg = =)
将图像直接插入Jupyter笔记本。
注意:您的计算机上应该有映像的本地副本
您可以将图像插入Jupyter笔记本本身。这样你就不需要将图片单独保存在文件夹中。
步骤:
将单元格转换为markdown: 在选中的单元格上按M 或 从菜单栏，单元格>单元格类型> Markdown。 (注意:重要的是将单元格转换为Markdown，否则步骤2中的“插入图像”选项将不起作用) 现在转到菜单栏，选择编辑->插入图像。 从磁盘中选择图像并上传。 按“Ctrl+Enter”或“Shift+Enter”。
这将使图像作为笔记本的一部分，你不需要在目录或Github上传。我觉得这看起来更干净，不容易破碎的URL问题。
在markdown中，您不能在图像文件的名称周围使用引号!
如果仔细阅读错误消息，您将在链接中看到%22的两个部分。这是html编码的引号。
你得换条线
![title]("img/picture.png")
to
更新
假设您拥有以下文件结构，并且在文件示例所在的目录中运行jupyter notebook命令。Ipynb(<——包含图像的markdown)被存储:
/
+-- example.ipynb
+-- img
+-- picture.png
出于某种原因，没有其他解决方案对我有效。以下是有效的方法:
将单元格更改为markdown 复制过去:
<div>
<img src="attachment:name.png" width="600"/>
</div>
在</div>后在同一单元格中创建一个空行，并使用鼠标将图像放到这一行中。 你会看到这样的东西:
<div>
<img src="attachment:name.png" width="600"/>
</div>
复制你的name.jpg，然后去掉你的name.png 删除! [yourname.jpg](附件:yourname.jpg)。 最终的结果应该是这样的:
<div>
<img src="attachment:yourname.jpg" width="600"/>
</div>
运行sell (shift+enter)，您将看到您的图像
