Javascript：將圖像中的顏色變爲鏈接？

基本上，有一個顏色編碼的地圖上有5個不同的地區。它們都是長方形的，不連續的，並且將永遠需要爲其製作圖像映射。我想知道是否有一種方法可以使顏色可點擊而不是製作荒謬的圖像地圖。如果將顏色分離成單獨的圖像或其他類似的詭計，則導致解決方案不會成爲問題。Javascript：將圖像中的顏色變爲鏈接？

而且，我會上傳圖片，但它是2.1MB

2012-03-17 That Guy

我唯一的建議是看看你是否能以svg格式獲取圖片並使用一些canvas/svg技巧...... – jondavidjohn 2012-03-17 17:45:43

就像jondavidjohn說的那樣。你也可以嘗試非常好的SVG庫http://raphaeljs.com/讓我只是注意到，你正在嘗試做的事情不會很容易。 – freakish 2012-03-17 17:55:02

無論如何，我可以讓JavaScript（或任何）獲得每個像素的顏色？我可以讓JS或PHP找出形狀併爲我製作圖像地圖......順便說一下，SVG看起來像更新的圖像地圖。 – 2012-03-17 18:06:29

嘗試將圖像渲染成<canvas>。在畫布上添加點擊處理程序，然後讀取單擊像素處的顏色值。如果你知道哪個顏色對應於哪個邏輯區域，那麼你得到了一個解決方案。

如果圖像沒有純色，您可能必須在點擊的像素周圍的小區域獲取平均值。

2012-03-17 18:02:27

據我所知，這個解決方案將無法在IE瀏覽器下工作（從Canvas獲取數據並未實現）。替代方案可能是通過AJAX發送鼠標座標，然後讓服務器處理。 – freakish 2012-03-17 18:05:04

畫布可能是個好主意。如果我要使用鼠標座標，我不妨製作一張圖像地圖。我必須由我的老闆來做這件事，看看最好的行動是什麼。 – 2012-03-17 18:23:03

回答