突出顯示美國各州，獲得分配的分類，並選擇相關的國家

Question

我不是100％確定從哪一個開始。

我懷疑我可以使用Google GeoMaps和getSelection()，但經過Google的Code Playground的一些試驗後，我沒有真正得到任何地方。

我的目標
我建立一個支持頁面的客戶，他們想在網頁上的地圖，當你將鼠標懸停在某些國家它顯示了總部在工具提示的區域。總部只針對各個地區，而不是針對所有州，因此當他們在密歇根州上空盤旋時，他們希望俄亥俄州和印第安納州也能突出顯示。

任何人都可以指向正確的方向嗎？我接受任何我剛剛開始使用GeoMaps的方法。

Answer 1

我確定這可以在多個框架中完成，但一種選擇是David Lynch的基於jQuery的maphilight：http://davidlynch.org/projects/maphilight/docs/。

這會在現有的HTML圖像地圖上創建地圖突出顯示行爲。他有一個使用地圖，美國在這裏的一個例子：http://davidlynch.org/projects/maphilight/docs/demo_usa.html

比方說，你必須要突出在一起的幾個領域（這只是一個例子，所以我已經簡化座標）：

<area href="#" title="MI" class="hq4" shape="poly" coords="562,99, 564,97, 566,96, 571,92, 573,91, 574,92, 569,97, 565,99, 563,100, 562,99"> 
<area href="#" title="OH" class="hq4" shape="poly" coords="708,208, 701,212, 697,214, 694,217, 690,221, 687,222, 684,222, 710,226, 708,208"> 
<area href="#" title="IN" class="hq4" shape="poly" coords="598,311, 597,307, 598,303, 600,300, 602,296, 604,292, 604,287, 602,284, 598,311"> 

注意，title屬性指定的狀態縮寫後，我已經放在一個class。 maphilight有一個名爲groupBy的選項，它可以完全滿足你的需求 - 它將多個區域分組，這樣，如果你將鼠標懸停在一個區域上，它們都會被突出顯示。當初始化maphilight，只需設置groupBy適當和所有與公共類的狀態將突出起來：

$('.map').maphilight({groupBy:"class"}); 

請注意，您不需要使用美國的地圖，他提供了 - 你可以這樣做與任何圖像映射，並且如果你有一組特定的狀態座標，你可以使用它們來創建一個映像圖 - 只要記住將同一個類添加到具有共同總部的那些州。