使用客戶端腳本的交互式地圖

Question

我期待開始一個簡單的Web應用程序項目，其目標是在用戶鍵入指定數字時在圖像/地圖上標記特定地點。

例如：假設文檔上有美國地圖，下面有一個文本字段表單。當用戶輸入（5）時，加利福尼亞州將被強調。

我見過類似的技術與鼠標懸停。但是我在JS，JQ，CSS和HTML方面的技能都達到了最大'recrational'。我剛剛描述的情景可能嗎？任何指導點/提示/提示都非常感謝。

謝謝

Answer 1

假設您的地圖是用Javascript和HTML創建的，這很容易。您需要驗證文本表單，以便每個區域與您期望用戶輸入的內容相鏈接。因此，對於您的示例，如果用戶鍵入（5），則您需要將其鏈接到地圖上的加利福尼亞地區的編號（即「加利福尼亞州」）。

這樣做的哈希與這些期望：

linkedArray = new Array(); linkedArray['5'] = "california";

等等，等等

然後檢查針對陣列的文本框的值，並有一個CSS類改變的背景顏色在你的地圖中需要的元素，而不是隻是將該類添加到該元素，如果它輸入到框中。

for var i in linkedArray{ if linkedArray[i] == $("yourTextbox").val() { $('"' + linkedArray[i] + '"').addClass("highlighted"); } }

如果您只有一個直線上升的Jpeg地圖這變得更加複雜。