如何從getJSON數組添加Google Map標記？

Question

我的PHP文件數組如下所示：

[
 {"lat":"4.174475","lon":"73.509564","datetime":"2012-11-23 16:41:40"},
 {"lat":"5.17","lon":"73.50633754680894","datetime":"2012-11-23 05:00:00"},
 {"lat":"6.17","lon":"73.50633754680894","datetime":"2012-11-01 00:00:00"}
]

當我單擊鏈接#Three時，它應該使用threeClick()函數生成3個標記。 這是功能。

function threeClick () {
  $.getJSON('json.search.php?idcard=<?php echo $idcardno; ?>&limit=3', function(data) {
    var location;
    $.each(data, function (key, val) {
      addMarker(val.lat,val.lon);
    });
  }

添加標記功能是這樣的（來自： 在Google Map上從Json Array繪制LatLng坐標---標記全部堆疊在同一位置 ）

function addMarker(lat,lng) {
  marker = new google.maps.Marker({
    position: new google.maps.LatLng(lat,lng),
    map: map,
    icon: "images/mapIcons/red-dot.png"
  });
  markersArray.push(marker);
}

我使用以下方法生成了地圖：

var map;
var markersArray = [];
function initMap() {
  var latlng = new google.maps.LatLng(4.174475, 73.509564);
  var myOptions = {
    zoom: 16,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  };
  map = new google.maps.Map(document.getElementById("mapcanvas"), myOptions);
}

有人可以建議我如何單擊鏈接顯示標記嗎？ 此代碼有什么問題？

Answer 1

您說您使用了此：

<a id="Three" onclick="threeClick">three</a>

問題在於threeClick本身並未真正調用該函數。 它只是引用它。 您需要括號來調用它，如下所示：

<a id="Three" onclick="threeClick()">three</a>

但是使用jQuery附加處理程序會更好。 因此，像這樣設置您的html：

<a id="Three" href="#">three</a>

然后將其添加到您的javascript中：

$('#Three').click(function() {
    threeClick();
    return false;
});

請注意，此處的return false是為了防止發生“＃”點擊默認操作（設置網址哈希）。