从JSON渲染多个Google Maps API V3标记

尝试使用来自DB的PHP从JSON输出使用Google Maps API V3绘制多个标记。

地图在页面上初始化，但不会填充标记。 浏览器警告“资源解释为其他，但转移MIME类型未定义。”？

建议进一步排除故障/调试。

 $(document).ready(function () { $.getJSON("map-service.php?action=listpoints", function(json) { if (json.Locations.length > 0) { for (i=0; i<json.Locations.length; i++) { var location = json.Locations[i]; addMarker(location); } } }); function addMarker(location) { var point = new google.maps.LatLng(location.lat, location.lng); var marker = new google.maps.Marker({ position:point, map: map, title: location.name }); }; }); 

来自map-service.php？action = listpoints的validation样本JSON输出

 {"Locations":[{"name":"Abco Mountain","lat":"49.424999","lng":"-125.855003"},{"name":"Adder Peak","lat":"49.248333","lng":"-125.320000"},{"name":"Alexandra Peak","lat":"49.738110","lng":"-125.489998"},{"name":"Argus Mountain","lat":"49.538612","lng":"-125.389999"},{"name":"Big Baldy Mountain","lat":"49.759998","lng":"-126.129997"}]} 

Answer 1

我的问题源于我如何初始化原始地图对象。 它在我分享的代码中不可见……道歉。

我这样做了：

 var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

并且应该这样做：

 this.map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

我发现这个post中的解决方案在地图创建后添加标记谢谢@yitwail！

Answer 2

尝试使用jquery $ .each进行循环。

if（json && json.Locations）{

$ .each（json.Locations，function（）{addMarker（this）;}）;

}）;

此外，您可能希望在addMarker函数内的lat和longiture上调用parseFloat。