如何从上传的 png 文件中打开 Google Colaboratory notebook 单元格中的图像？

Question

我正在使用 Google Colaboratory 笔记本。我上传了一个名为 bp.png 的文件到工作目录，我可以在代码单元格中通过运行ning !ls 看到该文件在那里。然后我尝试使用这段代码在降价单元格中查看图像：

<h2 align="center">Image</h2>
<img src="bp.png" width="600">

但是 Colab 笔记本的单元格在运行之后保持为空（header 除外），尽管如果我运行在本地 Jupyter 笔记本中，图像确实出现在该本地笔记本中的单元格。

更新：

我知道我可以使用上传到工作目录的文件，因为我上传的自定义 .py 文件可以毫无问题地导入到我的 Colab 笔记本中。例如，我可以上传一个文件 py_file.py，然后在 Colab notebook 中像 from py_file import some_function 那样使用它，并且它有效。

Answer 1

试试这个

from IPython.display import Image
Image('bp.png')

您也可以设置宽度和高度

Image("bp.png", width=100, height=100)

要显示多张图片，需要调用display。（只有 1 张图片是自动的）

from IPython.display import Image, display
display(Image('1.png'))
display(Image('2.png'))

更新jan/2019

将您的图片放入 /usr/local/share/jupyter/nbextensions/

然后从/nbextensions/开始显示，例如

%%html
<img src='/nbextensions/image.png' />

更新feb/2022

在 Google Colab 中，打开文件浏览器图标（左侧导航栏）并导航至 usr/local/share/jupyter/nbextensions，如上所述。单击 nbextensions 文件夹上的省略号菜单 > 上传和 select 要上传的图像。确保使用正确的文件名更新上面代码片段中的 img 标记，并且您需要使用代码框（而不是文本）。请注意，当您的运行时被回收时，您的图像将从目录中删除（我在上传图像时收到一个警告对话框，说明如此），所以要小心。

Answer 2

也可以在 Colab 的 markdown/Text 单元格中显示图像。创建一个文本单元格，然后您将有一个带有图标的顶部栏。 Select“插入图片”对应的图片图标，然后从本地机器中选择图片。它似乎不允许你从 google 驱动器 select，但是

Answer 3

这是一个可以显示来自任何目录的图像文件的函数。

请注意，此函数产生的结果与 IPython.display.Image 相同。

from IPython.display import HTML
from base64 import b64encode

def show_image(path_to_image, width=None, height=None):

    mime_type = None
    path_to_image = path_to_image.lower()

    # More MIME types:
    # https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types
    if path_to_image.endswith('.jpg') or path_to_image.endswith('.jpeg'):
        mime_type = 'image/jpeg'
    elif path_to_image.endswith('.png'):
        mime_type = 'image/png'
    elif path_to_image.endswith('.gif'):
        mime_type = 'image/gif'
    else:
        raise ValueError('Unknown extension: %s' % (path_to_image))

    img = open(path_to_image, 'rb').read()
    data_url = 'data:image/jpeg;base64,' + b64encode(img).decode()

    width_str = "width='%d'" % (width) if width is not None else ''
    height_str = "height='%d'" % (width) if height is not None else ''

    display(HTML("<img src='%s' %s%s>" % (data_url, width_str, height_str)))

示例：

show_image('frames/frame_1000.jpg', width=300)

如何从上传的 png 文件中打开 Google Colaboratory notebook 单元格中的图像？

How can I open images in a Google Colaboratory notebook cell from uploaded png files?

html

image

markdown

jupyter-notebook

google-colaboratory

更新jan/2019

更新feb/2022