画像の各色をカラーバーの様に表したい

Question

前提・実現したいこと

ある画像（既に画像ファイルとして存在しています）の各色が何を表しているのかをカラーバーの様に棒状にして画像に加えたいと考えています（ヒートマップの凡例をつくる）。例として下記の画像を示します。この色は標高何メートルと決めて標記したいです。緑色は0～100ｍ、オレンジ色は300～400ｍであったりとかいう感じです。画像は次のURLから引用しています。
https://www.gsi.go.jp/KIDS/KIDS07.html

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

初心者で大変申し訳ないですが、この表し方が分かりません。調査した結果、カラーバーとは自分がカラーマップを作成しそれを利用して作るといったものだと理解しています。上記の画像にある自分が表したい色を用いたカラーマップを自作する必要があるのか、はたまた画像の色を読み取りそれをカラーバーの様に表す事が出来るのかが分からない状態です。試しに任意で等高線を作り、カラーバーを表示してみました。この等高線の様に上記の画像を基に、カラーバーの軸を0、100、200、300、400・・・の様にしたいです。エラーメッセージは出ませんでした。

該当のソースコード

任意の等高線とそのカラーバーを作ったソースコードを示します。しかしこれはあくまでこの様な等高線のカラーバーはこの様に表したいというイメージであり、実際に私が求めるのは上記のURLにある画像の色をカラーバーの様に表したいという事です。

import matplotlib.pyplot as plt
import numpy as np


# データを作成する。
def f(x, y):
    return np.sin(x) ** 10 + np.cos(10 + y * x) * np.cos(x)


x = np.linspace(0, 5, 50)
y = np.linspace(0, 5, 40)
X, Y = np.meshgrid(x, y)
Z = f(X, Y)

# 等高線を作成する。
fig, ax = plt.subplots()
c = ax.contourf(X, Y, Z, 20, cmap="jet")
fig.colorbar(c)

plt.show()

出力は以下の様です。

試したこと

調査した結果、カラーバーとは自分がカラーマップを作成しそれを利用して作るといったものだと理解しています。上記の画像にある自分が表したい色を用いたカラーマップを自作する必要があるのか、はたまた画像の色を読み取りそれをカラーバーの様に表す事が出来るのかが分からない状態です。とりあえずイメージを考えたいとの事で、任意の等高線とカラーバーを作成しました。

補足情報（FW/ツールのバージョンなど）

言語：Python
環境：Windows10
ブラウザ：Google　chrome（Google　Colaboratory)
＊ノートパソコンです。全て最新バージョンです。プログラミング中はcolab以外のタブ、アプリは開いていません。
＊急ぎの内容の為、以下のサイトでも同様の質問をさせていただいています。他サイトで解決した場合、こちらでも明記します。
https://ja.stackoverflow.com/questions/82701

Comments

[etherbeg]

> ある画像の各色が何を表しているのかをカラーバーの様に棒状にして画像に加えたい

「ある画像」がすでに画像ファイルとして存在するものを指すのか、それともこれから matplotlib 等のライブラリを使用してデータから画像を作成するのか、によって方法は違ってくると思います。「実際に私が求めるのは上記のURLにある画像の色をカラーバーの様に表したい」とおっしゃっているので、前者なのでしょうか。

[Vamosj1VIVA]

大変申し訳ございません。仰る通り、前者でございます。修正しておきます。

[1T2R3M4]

https://ja.stackoverflow.com/questions/82701

以下ご対応ください。
https://teratail.com/help#posted-otherservice

[meg_]

こちらの方（https://ja.stackoverflow.com/questions/82701/%e7%94%bb%e5%83%8f%e3%81%ae%e5%90%84%e8%89%b2%e3%82%92%e3%82%ab%e3%83%a9%e3%83%bc%e3%83%90%e3%83%bc%e3%81%ae%e6%a7%98%e3%81%ab%e8%a1%a8%e3%81%97%e3%81%9f%e3%81%84）に回答が付いていますが、それでは解決しませんでしたか？

[Vamosj1VIVA]

@1T2R3M4
大変申し訳ございません。初心者なもので利用規則を完全に把握しておりませんでした。修正しておきます。2度と違反しない様に善処します。

[fana]

【特定の画像に対して，手作業で「何色が何メートルなのか？」という情報を収集し，その結果値を与えてやれでば終了だよね】というところまでは自明な話だと思うのですが，
それに対して，何が解決すべき課題なのでしょう？

・単に手作業だと面倒だから，可能であればしたくないなぁ　というだけの話
・不特定多数の画像に対応せねばならず，それぞれの画像で標高値に対する色とかが異なっているから，手作業ではとてもやってられない！　という状況にあるという話
・etc

[Vamosj1VIVA]

@fana
大変申し訳ございません。仰る通り、何が解決すべき問題かの明記がなされていませんでした。私が抱えている問題は2番目の内容です。

[fana]

２番目　とは

> ・不特定多数の画像に対応せねばならず，それぞれの画像で標高値に対する色とかが異なっているから，手作業ではとてもやってられない！　という状況にあるという話

ということですか？
（だとしたら，statck overflow 側でもそういう旨が伝わっていないように見えるが）

[thkana]

> ・不特定多数の画像に対応せねばならず，それぞれの画像で標高値に対する色とかが異なっているから，手作業ではとてもやってられない！　という状況にあるという話

やってられないとしても、まずは「手作業でやる手順」を考えてみて、それが何らかの形で「決まった作業」に落とし込めるならそれをプログラムで書けばいいでしょう。でも、各々の図毎に手順が違うなら(余程たくさんの図があって機械学習とかいう話になるのでない限り)結局「手作業」が一番効率がよくなりそうです。

それはそれとして、やりたい作業には「ヒートマップの凡例を作る」という名前をつけると一般に通じそうな気がします。

[Vamosj1VIVA]

@fana
すいません、私のコメントが間違っていました。2番目の内容も実際にはあるのですが、それよりも大変恐縮ですが結果を与えてそれを出力するという方法がはっきりと分からなかったという事です。私自身が無知な事は承知ですので、これから勉強していきたいと思っています。

[Vamosj1VIVA]

＠thkana
前半部分については上記で記した通り、私の記載ミスであったので心にとどめておきます。私もその様に感じておりました。最後の段落の件については、修正させていただきます。ありがとうございます。

[Vamosj1VIVA]

＠meg_
解決致しました。

Answer 1

上の図と同じ配色にしたいのであれば、そういうカラーマップを作れば以下の図になります。

やりたいことがこれなのか、そうでないのかが良くわかりません。

やりたいことが違っているなら、何をやりたいのかを明確にしてください。

ソースコード

import matplotlib.pyplot as plt
import numpy as np
from matplotlib.colors import LinearSegmentedColormap

cdict = {
    "red": [
        (0.0, 0.0, 0.0),
        (0.2, 0.0, 0.8),
        (0.4, 0.8, 1.0),
        (0.6, 1.0, 1.0),
        (0.8, 1.0, 1.0),
        (1.0, 1.0, 1.0),
    ],
    "green": [
        (0.0, 1.0, 1.0),
        (0.2, 1.0, 1.0),
        (0.4, 1.0, 0.8),
        (0.6, 0.8, 0.6),
        (0.8, 0.6, 0.4),
        (1.0, 0.4, 0.4),
    ],
    "blue": [
        (0.0, 0.0, 0.0),
        (0.2, 0.0, 0.4),
        (0.4, 0.4, 0.4),
        (0.6, 0.4, 0.0),
        (0.8, 0.0, 0.0),
        (1.0, 0.0, 0.0),
    ],
}

cmap = LinearSegmentedColormap("custom", cdict)

def f(x, y):
    return np.sin(x) ** 10 + np.cos(10 + y * x) * np.cos(x)

x = np.linspace(0, 5, 50)
y = np.linspace(0, 5, 40)
X, Y = np.meshgrid(x, y)
Z = f(X, Y)

# 等高線を作成する。
fig, ax = plt.subplots()
c = ax.contourf(X, Y, Z, 20, cmap=cmap)
fig.colorbar(c)

plt.show()

Comments

[Vamosj1VIVA]

大変申し訳ございません。私の記述不備で意図がしっかり伝わらなかった事、謝罪いたします。しかし提示して頂いたプログラムは私が研究を進めていく上で大変有益な情報であると考えています。ありがとうございました。

Answer 2

以下がプログラムと結果です。回答、ご指摘頂いた方ありがとうございました。

from PIL import Image
import matplotlib as mpl
import matplotlib.pyplot as plt

# 画像の色を指定する
cmap = mpl.colors.ListedColormap(['#00ff00', '#ccff66', '#ffcc66', '#ff9900', '#ff6600'])
# 不連続なカラーバーを作成する
bounds = [b for b in range(0, 501, 100)]
norm = mpl.colors.BoundaryNorm(bounds, cmap.N)

# カレントディレクトリの地形画像を読み込む
with Image.open("000137042.png") as img:
    plt.imshow(img, cmap=cmap, norm=norm)
    cbar = plt.colorbar()
    # カラーバーの目盛(0,100,200,300,400 over)を指定する
    cbar.ax.set_yticklabels(['0','100','200','300', '400 over', ''])
    plt.show()

Comments

[fana]

> ['#00ff00', '#ccff66', '#ffcc66', '#ff9900', '#ff6600']

とかいう色の集合や，

> ['0','100','200','300', '400 over', '']

みたいな目盛りの値というのは画像毎に異なることになると思われ，そのことに対して
【ある画像が与えられた場合に，その画像データから色や目盛値を（自動的に，あるいは半自動的に）取得する方法】
というのが問題なのかと思っていたのですが，

そうではなくて，

【色や目盛値のデータが既に存在する（←これは人手で用意する）とき，カラーバーを表示するための実装コード（要は，matplot(?)とかいうやつの使い方）はどうなる？】
っていうだけの話だったわけですか．

[fana]

＃マルチポスト先でも問題を同様に誤解して(?)画像から色抽出しようとしたりしていた様子．

[Vamosj1VIVA]

最終的にはメモリの値が異なるのでそれも問題ではあります。ただひとまず最初の段階として私が記した様なプログラムが欲しかったというわけです。今後も異なる画像に対して貴方が仰る通り扱っていきますが、その過程で又不明点があればお世話になるかもしれません。マルチポスト先は1人目の回答者が完璧な方で、2人目の方は回答ではないと前置きした上で考察結果をまとめてくれていました。全員に感謝しております。

[fana]

完全自動じゃなくてよいなら，例えば
（今回例示された画像にちょうど謎の直線が引かれていますが，そんな感じで）
人間が「この線上を見ろ」ということくらいを指定する…みたいな半自動な方法等が考えられそうに思えます．
（人間が等高線を横切るような線を指定してやるならば，色を実行時に拾い集めるのは難易度高くないであろう）

目盛りの数字を認識するのはさすがにつらいので，そこは人手で最低値（今回の画像の例だと0）と段階値（同100）くらいを与えたほうがはやいか．

[Vamosj1VIVA]

勉強になります。ありがとうございます。