Google Maps AP v3 I - 尝试使用 jQuery $.ajax 动态添加标记

Question

我正在使用 Google Maps API v3 为我的应用程序创建一个地图，以便在我们的网络广播中向观众展示。这个想法是当一个新的观众跳到流上时在地图上添加一个新的标记。那就是地图没有重新加载，只是添加了一个新的标记。

我正在尝试通过 ajax 调用获取当前查看者的脚本来完成此操作。我有一个输出到控制台来显示结果，而且经纬度坐标是正确的，所以我不知道为什么它没有把标记放到地图上。

我在页面中使用地图引用与使用 ajax 脚本调用相同的类，因此我可以在页面上的 javascript 中间执行 PHP foreach 循环，并将标记放在地图上！但是，当然，我需要使用 ajax 来获取新的服务器端信息（新查看器）。

带有 php foreach() 的 js（有效）

注意：我是这样测试的，在$.ajax成功函数中，但与ajax脚本无关

//add markers
function addMarker(stream_id) {
  $.ajax({
    dataType: 'json',
    url: '../../stream/' + stream_id + '/mapmarkers',
    success: function(result) {
      <?php foreach($stream_viewer_info as $viewer) : ?>

        markers.push(new google.maps.Marker({
          position: new google.maps.LatLng(<?= $viewer['location_info']['latitude'] . ', ' . $viewer['location_info']['longitude']; ?>),
          map: map
        }));

      <?php endforeach; ?>

    },
    complete: function() {
      setTimeout(function(){addMarker(<?=$stream_id; ?>)}, 1000);
    }


  });
}

js 与 js for()（不起作用）

//add markers
function addMarker(stream_id) {
  $.ajax({
    dataType: 'json',
    url: '../../stream/' + stream_id + '/mapmarkers',
    success: function(result) {
      for(var i = 0; i < result.length; i++) {
          console.log('result ' + i + ': ' + result[i]['latitude'] + ', ' + result[i]['longitude']);

        markers.push(new google.maps.Marker({
          position: new google.maps.LatLng(result[i]['latitude'] + ', ' + result[i]['longitude']),
          map: map
        }));

      }

    },
    complete: function() {
      setTimeout(function(){addMarker(<?=$stream_id; ?>)}, 1000);
    }


  });
}

Answer 1

试试这个

markers.push(new google.maps.Marker({
    position: new google.maps.LatLng(result[i]['latitude'], result[i]['longitude']),
    map: map
}));

您需要用实际的逗号分隔参数，而不是字符串