PHPで画像色抽出

社内の方も社外の方もこんばんは。2015年度新卒入社したmekkooです。
Advent Calendarの季節です。街には色があふれていますね。
僕はひたすら画面を見つめているのですが、最近感動したUIがあります。

## iTunesに最近搭載された...
![2015:11:16MediaLT.001.jpeg](https://qiita-image-store.s3.amazonaws.com/0/9246/04e2afc5-1181-7466-bc99-e90346f7e528.jpeg)

美しい。かっこいい！
没頭できる。アルバムアートをちゃんと設定しようという気になる。
PHPで再現して、メディアに取り入れてみたい…

## PHPでClassを作ってみよう！
### 画像色抽出どうすればいいか考えた
* 画像をオブジェクトとして読み込んで
    * phpなら、``imagecreatefrom*()`` 関数
* 左上から右下へ、ピクセルを走査していく？
    * 大きな画像の場合、10px毎とかでスキップしながらでもいいかも
* 最終的に、カラーコードの平均を取る？

## 実際にやってみた
```php
<?php
class SenseOfColor
{
    private $filepath;
    public function __construct($filepath)
    {
        $this->filepath = $filepath;
    }
    public function getAverageColor()
    {
        //画像(今回はPNG)をオブジェクトとして読み込んで
        $img  = imagecreatefrompng($this->filepath);
        $imgX = imagesx($img); //ヨコと
        $imgY = imagesy($img); //タテのpx数を取得して
        $imgXY = $imgX*$imgY; //掛けあわせて
        $rSum = '';
        $gSum = '';
        $bSum = '';
        for ($y = 0; $y < $imgY; $y++) { //左上から右下にかけてfor文で走査
            for ($x = 0; $x < $imgX; $x++) {
                $rgb = imagecolorat($img, $x, $y); //rgbコードを取得して
                $r = ($rgb >> 16) & 0xFF; //赤を10進数に
                $g = ($rgb >> 8) & 0xFF; //緑を10進数に
                $b = $rgb & 0xFF; //青を10進数に
                $rSum += $r; //それぞれを合算していく...
                $gSum += $g;
                $bSum += $b;
            }
        }
        //合算された赤(R),緑(G),青(B)をそれぞれ画像の合計px数で割り、
        //再度16進数に変換した上で出力
        return '#'.dechex($rSum/$imgXY).dechex($gSum/$imgXY).dechex($bSum/$imgXY);
    }
}

class SenseOfColorFactory
{
    public static function create($filepath)
    {
        return new SenseOfColor($filepath);
    }
}

//任意のPNG画像を指定すると...
$target = SenseOfColorFactory::create('img/foobar.png');
//平均色のカラーコードを返せる
print($target->getAverageColor());
```

## 上記コードで実際にアルバムアートの色抽出をやってみる

### スーベニア / スピッツ
「正夢」「春の歌」などが収録されたスピッツ屈指の名作。
もう10年前か！今年も終わる...

<a href="http://www.amazon.co.jp/exec/obidos/ASIN/B00BH2WVRA/-22/ref=nosim/" rel="nofollow" ><img width=200px height=200px src="http://ecx.images-amazon.com/images/I/513elvPkw4L._SS500_.jpg" style="border: none;" alt="正夢" /></a> ---> ![b92b1c.png](https://qiita-image-store.s3.amazonaws.com/0/9246/7c85c7ec-2077-ecb3-bad2-74be68bf7e21.png)

うん、まずまずの近さ

### Light Wave' 14 / V.A.
最近よく聞いている Ano(t)raks レーベルのコンピレーションアルバム。
Web上で公式に全曲配布されている!! メロウで素敵なシティ・ポップ集。
https://anotraks.bandcamp.com/album/light-wave-14-vol-3

<a href=""><img width=200px height=200px src="https://f1.bcbits.com/img/a0096572386_16.jpg"></a> ---> ![333a4e.png](https://qiita-image-store.s3.amazonaws.com/0/9246/9d6b1e71-dd53-6153-a745-dd197202a9eb.png)

素敵な感じ！

### LDK Lounge Designers Killer / capsule
ネオ渋谷系の盟主 capsule の最高にかわいいアルバム。
``空飛ぶ都市計画`` はスタジオジブリがMVを制作したことでも話題になりました。

<a href="http://www.amazon.co.jp/exec/obidos/ASIN/B000A6KACW/-22/ref=nosim/" rel="nofollow" ><img width=200px height=200px src="http://img2-ak.lst.fm/i/u/300x300/a36646f9f3b64990b7cb86581747e285.jpg" style="border: none;" alt="L.D.K Lounge Designers Killer" /></a> ---> ![9fbe36.png](https://qiita-image-store.s3.amazonaws.com/0/9246/872dc762-3f15-bb0d-ba55-7314eb8410af.png)

青春が蘇る...

## 上3つのような単色ならうまくいくが…

### BEST OF TRATTORIA YEARS / Bridge
90年代の前半に活躍していた、アコーディオン鳴り響くギターポップバンド。
カジヒデキが過去在籍していたことでも知られる。

<a href="http://www.amazon.co.jp/exec/obidos/ASIN/B000056243/-22/ref=nosim/" rel="nofollow" ><img width=200px height=200px src="http://ecx.images-amazon.com/images/I/31J96AEN9BL.jpg" style="border: none;" alt="ベスト・オブ・トラットリア・イヤーズ" /></a> ---> ![c2951f.png](https://qiita-image-store.s3.amazonaws.com/0/9246/3f7fa55c-558c-4df8-d056-4b33bdc7688d.png)

あれ？色が濃いぞ！せっかくの淡い黄色が…

### `85 / Pizzicato Five
ピチカート・ファイヴが佐々木麻美子さんをボーカルに据える4人構成(なのにファイヴ)だった時代の音源の再販品。
最高のウィスパーボイスを聴いて完全な現実逃避ができる。

<a href="http://www.amazon.co.jp/exec/obidos/ASIN/B00005LCPC/-22/ref=nosim/" rel="nofollow" ><img width=200px height=200px src="http://ecx.images-amazon.com/images/I/31PBH3A5Z4L.jpg" style="border: none;" alt="Pizzicato five 85" /></a> ---> ![faa055.png](https://qiita-image-store.s3.amazonaws.com/0/9246/de86cd8e-fdca-5620-2b8b-8b44dba0f218.png)

今度は薄すぎ！

## 何故ならば... 平均色を取ってるだけだから、色が拮抗している状況だとうまくいかない
iTunesはもっと頭良かったよ！
今後は``getAverageColor()``以外のメソッドを追加して徐々にiTunesに近づけていきたい

## 以上、好きな音楽紹介でした
現時刻はAdvent Calendar担当日の23:22です。