如何从 getJSON 数组添加谷歌地图标记？答案

【问题标题】：How to add Google Map markers from getJSON array?如何从 getJSON 数组添加谷歌地图标记？
【发布时间】：2012-11-25 11:31:58
【问题描述】：

我的 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);
    });
  }

添加标记功能是这样的（来自：Plotting LatLng coordinates from Json Array on Google Map --- the markers all stack up in the same location）

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);
}

谁能建议我如何在点击链接时显示标记？这段代码有什么问题？

【问题讨论】：

我没有发现您发布的代码有任何问题。请编辑您的帖子并添加您用于事件处理程序的代码（捕获点击#Three 并调用threeClick() 函数的代码）。
另外，正如@Andreas 指出的那样，还请描述您遇到的问题，包括任何错误消息（或缺少错误消息）。
@BenLee 我用过 three 。问题是标记没有来
@jinni，您在 javascript 控制台中看到任何错误消息吗？

标签： javascript json google-maps

【解决方案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是为了防止'#'点击默认动作（设置url哈希）发生。

【讨论】：

是的。我错过了。但是我用了 onclick="threeClick()" 并没有用
我接受了您的回答，因为您是建议检查 javascript 控制台的人。问题是单击功能末尾缺少括号 ) 。我的错误：D