JavaScriptとcanvasを使って、軽量な色抽出方法を探る続きです。前回、抽出がうまくいかなかったボールの影の部分を調整しました。RGBの値について配分も評価すると、より抽出精度が上がります。
影の色抽出は難しい
赤いボールを色で抽出するとき、影の部分の抽出は難しいです。
色は暗くなるほど彩度が低くなり、R、G、Bの値に差がなくなります。
前回の色抽出では、赤ボールの影を抽出できず、逆にほかのボールの影が反応してしまいました。
赤みの強い床で、暖色の光を当てた画像で検証しているので、難易度が高い気もします。ただ、このような環境でも、赤ボールを抽出するようにはしたいです。
木材にはG成分が含まれる
誤認している木材の色は茶色やベージュです。この色はRとGの成分が多く、対してボールの影はR成分だけが多いです。
つまり、G成分を判断すれば、フローリングなどの木材の誤認を防げるかと思います。
抽出精度がかなり上がる
仮に、R成分の半分以上G成分を含む場合は茶色とみなし、除外して抽出します。
この条件を加えると、かなりの精度で抽出できるようになりました。
さすがにロゴの部分は欠けてしまいますが、色のみでの抽出としては、これくらいで十分だと思います。
色の抽出は当初、RGBをHSV（色相、彩度、明度）に変換してから評価した方が簡単だと思っていましたが、canvasがRGBの配列なので、変換にパワーを使ってしまいます。
RGBのまま色の抽出精度を上げられたことで、軽量化できました。
引き続き、自動で色域を判断する機能を追加しようと思います。