PythonのCanvasに画像が表示されない

Question

###実現したいこと

画像をウィンドウのcanvasに表示させたいです。
macOSを使っています。

###発生している問題・エラーメッセージ

PIL import でエラーを回避できたのですが、ウィンドウに指定した画像が表示されません。
映したい写真のフォーマットはpngです。
画像を差し替えたところ、表示される画像と表示されない画像がありました。
その二つの画像を比べたところ容量は対して変わりませんでした。違いがあるとした映る方は四角形で、映らない方は輪郭があります。

エラーは起きません。

###Python source code

import tkinter
from PIL import Image, ImageTk

#略

#pictures to read
img1 = ImageTk.PhotoImage(file = 'img4/chap4-1-1.png')
img2 = ImageTk.PhotoImage(file = 'img4/chap4-1-2.png')
img3 = ImageTk.PhotoImage(file = 'img4/chap4-1-3.png')

#crate a canvas
canvas = tkinter.Canvas(root, width=640, height=480)
canvas.place(x=0, y=0)
canvas.create_image(320, 220, image=img1, tag="illust")

#略

root.mainloop()

Answer 1

おはようございます。

問題文読ませていただきました。

画像特有の問題の可能性が高いですので、以下の手順でご確認いただけますか?

1. その他の画像パスで検証してみる。
2. 以下のソースコードを元に、「こちら問題の画像パスをご入力ください。」部分を変更して検証いただく。
3. canvas optionにbg='red'を追記して、画像が確認できるか検証いただく。

import tkinter
from PIL import Image, ImageTk

# Windowを作成する。
root = tkinter.Tk()

# Windowを親要素としてcanvas Widgetを作成する。
# width : 幅の設定
# height : 高さの設定
# Canvasについて : https://kuroro.blog/python/V63iINoXI8iwMeRMEJPK/
canvas = tkinter.Canvas(root, width=640, height=480)
# Windowを親要素として、canvas Widgetをどのように配置するのか?
# placeについて : https://kuroro.blog/python/JyaHUKyFyxCa0baFfXg0/
canvas.place(x=0, y=0)

# こちら問題の画像パスをご入力ください。
# convert, pointについて(参考): https://qiita.com/pashango2/items/145d858eff3c505c100a
# 画像について : https://kuroro.blog/python/Z7k1LSyDyiDHtD5UCjmG/
img1 = ImageTk.PhotoImage(Image.open('/xxx/xxx.png').convert("L").point(lambda x: 0 if x < 230 else x))

# 画像を表示する。
# Canvasについて : https://kuroro.blog/python/ANyM9WLpd0LSXRQAELOj/
# 第一引数 : x座標
# 第二引数 : y座標
# image : 画像パス
# tag : 図形へタグ付けを行う。
canvas.create_image(320, 220, image=img1, tag="illust")

# Windowをループさせて、継続的にWindow表示させる。
# mainloopについて : https://kuroro.blog/python/DmJdUb50oAhmBteRa4fi/
root.mainloop()

よろしくお願いいたします。????‍♂️

Answer 2

映る方は四角形で、映らない方は輪郭があります

もしかしたら、アルファ値(透過度)をもった画像だと表示できないのでしょうかね？

であれば、

img1 = ImageTk.PhotoImage(Image.open('img4/chap4-1-1.png').convert('RGB'))
img2 = ImageTk.PhotoImage(Image.open('img4/chap4-1-2.png').convert('RGB'))
img3 = ImageTk.PhotoImage(Image.open('img4/chap4-1-3.png').convert('RGB'))

のように、画像を "RGB"に変換すると表示できるようになるかもしれません。
（ただし透明の箇所がなくなります。）

Comments

[lucasiel]

この場合背景は何色になるのでしょうか。もし背景を白くしたい場合は、
img1 = ImageTk.PhotoImage(Image.open('img4/chap4-1-1.png').convert('RGB'), bg='white')
と後ろに色を指定して大丈夫でしょうか。

それと答えられたらで構わないのですが、open関数とfile =""　とではどのような違いがあるのでしょうか。

[magichan]

> この場合背景は何色になるのでしょうか。
元画像によります。
透過がある画像の場合、各ピクセルのデータは（一般的に） "RGBA" つまり（赤、緑、青、α値)の４値から構成されております。これを RGBに変換した場合、単にα値を使わずに"RGB"の３値で画像を表示することになるので元画像のRGB値によることになります。

> open関数とfile =""　とではどのような違いが
ImageTk.PhotoImage(file = 'xxx.png')
のようにfileを指定すると、
Image.open('xxx.png')
でファイルをロードするとの記述がドキュメントにあります。

http://pillow.readthedocs.io/en/3.4.x/reference/ImageTk.html

[lucasiel]

解決しました。
わかりやすい説明で理解はしましたが、python難しいですね。笑
ドキュメントのソースありがとうございます。

また答えていただいてありがとうございます。