如何从上传的png文件中打开Goog​​le Colaboratory笔记本单元格中的图像？

Question

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

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

但Colab笔记本电脑的单元格在运行之后保持空白（标题除外），但如果我在本地Jupyter笔记本中运行它，图像会出现在本地笔记本的单元格中。

更新：

我知道我可以使用上传到工作目录的文件，因为我上传的自定义.py文件被导入到我的Colab笔记本中而没有任何问题。例如，我可以上传文件py_file.py，然后在Colab笔记本中使用它，就像from py_file import some_function一样，它可以正常工作。

Answer 1

试试这个

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

您也可以设置宽度和高度

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

要显示多个图像，您需要调用显示。 （这只是1张图片的自动）

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

更新jan / 2019

将图片放入/usr/local/share/jupyter/nbextensions/google.colab/

然后从/nbextensions/google.colab/显示，例如

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

Answer 2

还可以在 Colab 的 Markdown/Text 单元格中显示图像。创建一个文本单元格，然后您将拥有一个带有图标的顶部栏。选择“插入图像”对应的图像图标，然后从您的本地机器中选择图像。不过，它似乎不允许您从谷歌驱动器中进行选择

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)