如何檢測圖像是否具有透明背景和白色文字

Question

有沒有人找到一種有效的方法來檢測圖像是否具有透明背景和圖像內的白色文字？即當此圖像顯示在白色背景上時，將不會顯示。

這裏要做的正確的事情是使用不同的圖像，這可能是最終的解決方案，儘管在第一個例子中我想看看是否可以實現自動化。在我看來，理想的解決方案是，如果圖像具有包含白色文本的透明背景，則爲該圖像提供一個「lightblue」的CSS背景，以便圖像顯示出來。

這裏面臨的挑戰是什麼歸類爲白色文本？白色或超過圖像非透明部分的30％的單個像素爲白色或其他內容？

有沒有人發現過這種可能性？最好使用Java處理圖像並確定是否需要應用背景，以便可以設置某種標誌，或者甚至更好，這是我沒有遇到的一種很好的CSS或JavaScript技巧。

Answer 1

1. HTML/CSS：在慣常的伎倆並不需要在所有的任何編碼，使覆蓋文本可見，無論顏色/圖像的亮度是添加文字陰影：

   text-shadow: 0px 0px 3px rgba(0, 0, 0, 1); 
   

   只需使用0px來獲得水平/垂直陰影偏移和輕微的模糊效果，所以您實際上會在文本週圍形成一個不透明的邊框。

---

JS：如果你真的想用像素來檢查像素，並獲得感亮度/色彩存在於的部分你的文字圖像將被覆蓋。

使用HTML5的畫布，您可以在畫布中繪製圖像並逐個像素地檢查並計算平均RGB值並使文本顏色適應此。即使你得到了正確的結果，這仍然是一個平均值，並且當文本的顏色太接近時，文本仍然會滲入圖像中。

我想用一些Google搜索，你會發現帆布包裝庫在JS中爲你做這個。

---

的Java：同樣的方法與JS - 確定哪些矩形圖像將通過短信被覆蓋，並獲得平均顏色。

使用BufferedImage，無論圖像類型如何（jpeg，png，...），都可以獲取內存中的每個像素供您檢查。

---

我會去的速贏文本陰影的解決方案，這需要根本不編碼。 如果你真的需要將圖像保存爲圖像，而不是隻顯示給用戶在網頁，我只會去2或3。