使用 json.parse 添加的谷歌地图标记答案

【问题标题】：google maps marker added using json.parse使用 json.parse 添加的谷歌地图标记
【发布时间】：2015-06-29 23:29:00
【问题描述】：

考虑到下面的代码，我尝试在控制台中打印解析数组的长度并且该过程正常工作，现在即使我已经有了添加通过 js 代码中加载的 json 文件解析的信息的数组，我无法在地图内显示标记数组

var map;
function initialize() {
  var mapOptions = {
    zoom: 8,
    center: new google.maps.LatLng(41.90832, 12.52407)
  };
  map = new google.maps.Map(document.getElementById('map-canvas'),
      mapOptions);
}

google.maps.event.addDomListener(window, 'load', initialize);

var xmlhttp = new XMLHttpRequest();
var url = "json/prova.json";

xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        myFunction(xmlhttp.responseText);
    }
}
xmlhttp.open("GET", url, true);
xmlhttp.send();

function myFunction(response) {
    var arr = JSON.parse(response);
    var i;
    var out = "<table>";

    for(i = 0; i < arr.length; i++) {
        out += "<tr><td>" +
        arr[i].title +
        "</td><td>" +
        arr[i].latitude +
        "</td><td>" +
        arr[i].longitude +
        "</td></tr>"
		;
		//console.log(arr.length);
    }
    out += "</table>"
    // document.getElementById("map-canvas").innerHTML = out;
}

				html, body, #map-canvas {
				height: 100%;
				margin: 0px;
				padding: 0px
			  }

<!DOCTYPE html>
<html>
<head>
         <title>Simple Map</title>
         <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
         <meta charset="utf-8">
		<script src="http://maps.google.com/maps/api/js?signed_in=true&amp;key=AIzaSyD3Xz7-z7U_XzZiaOlx9khhtFSld8vd0k4"></script>
        <script src="js/prova_simple.js"></script>
</head>	 
<body>

		<h1>Customers</h1>
		<div id="map-canvas"></div>

</body>
</html>

【问题讨论】：

您能否提供示例 JSON 和代码 sn-p（Minimal, Complete, Tested and Readable example），可以在没有 javascript 错误的情况下工作（或至少演示问题）
[ { "title": "Coop.Sociale Prassi e Ricerca Onlus", "latitude": 41.9114145, "longitude": 12.524204 }, { "title": "Astronave", "latitude": 41.912333，“经度”：12.525531 }，{“标题”：“卡萨”，“纬度”：41.877719，“经度”：12.558317 }]
我已经测试了 json 文件并且它可以工作
您没有尝试在代码中创建任何标记
你说得对，事实是我不知道在哪里尝试创建它

标签： javascript ajax json google-maps-api-3

【解决方案1】：

嗯！！！！您的 json 有标记的 lat 和 lng，您可以尝试使用示例代码将多个标记添加到谷歌地图中

var infowindow = [];
var marker = [];
function myFunction(response) {
    var arr = JSON.parse(response);
    for(var i = 0; i < arr.length; i++) {
            (function(i){ //new line 
            infowindow[i] = new google.maps.InfoWindow({
                content: arr[i].title
            });
            marker[i] = new google.maps.Marker({
                    title: arr[i].title,
                    animation: google.maps.Animation.DROP,
                    //animation: google.maps.Animation.BOUNCE,                        
                    position: new google.maps.LatLng(arr[i].latitude,arr[i].longitude)
                });
            google.maps.event.addListener(marker[i], 'click', function() {
               infowindow[i].open(map,this);
            });
            })(i); //new line
    }
}

【讨论】：

您能建议我在代码的正确部分添加您的 sn-p 吗？顺便谢谢你的回复
我尝试过复制和过去作为面子问题我不知道这个 sn-p 的位置高于或低于 ajax 请求？我试图将这部分插入到 ajax 请求中，因为无论如何我在 ajax 请求中声明了 arr 变量，我无法添加任何标记，我在镜像服务器上运行了代码，但没有任何反应
啊。抱歉，请删除行 icon: new google.maps.MarkerImage(icon),
我尝试使用大写字母 I 将 info 替换为 Info 但我的朋友再次没有任何反应，相信我我已经尝试过你的更新答案，事实上我可以正确地居中地图使用 console.log 获取数组的长度，所以我假设 ajax 请求正常工作，但我无法在地图上添加这些标记我很确定我犯了一些愚蠢的错误，但我不知道在哪里，谢谢你提前
我没试过，我用过我的镜像服务器，你建议我用小提琴吗？无论如何，在调试中，无论大写字母未定义，我都可以看到 Info 或 infowindon 有一刻我验证了小提琴上的代码