尝试将值从数组传递到 Google Maps 对象时出错答案

【问题标题】：Getting error when trying to pass values from array to Google Maps Object尝试将值从数组传递到 Google Maps 对象时出错
【发布时间】：2011-10-02 09:04:59
【问题描述】：

我在页面上使用 wordpress 发布数据设置一些 json，然后将该 json 传递给一些 JS，该 JS 循环并添加标记到地图。我很接近让它工作，只需要弄清楚最后一部分。

我的 PHP 代码从数组创建 json：

<script type="text/javascript">
var markers = <?php echo json_encode($pageposts);?>  
</script>

这是我的 JS 代码： var infowindow = null;

  $(document).ready(function(){
  initialize();
   });

function initialize() {

var centerMap = new google.maps.LatLng(41.141208, -73.263726);
var options = {
    zoom: 12,
    center: centerMap,
    mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById('map'), options);    

setMarkers(map, markers);
  infowindow = new google.maps.InfoWindow({
    content: "loading..."
  });
}

function setMarkers(map, markers) {
  for (var i = 0; i < markers.length; i++) {
  var marker = new google.maps.Marker({
  position:  new google.maps.LatLng(markers[i].meta_value), 
  map: map
});

var contentString = "Some content";

google.maps.event.addListener(marker, "click", function () {
//infowindow.setContent(this.html);
//infowindow.open(map, this);
});

} }

如果您想查看嵌入了 json 的页面 - 请查看此链接： http://www.fairfieldctguide.com/test-map 查看源代码：http://www.fairfieldctguide.com/test-map

任何帮助将不胜感激！杰克

【问题讨论】：

我没有看到任何循环。

标签： php javascript arrays json google-maps-api-3

【解决方案1】：

google.maps.LatLng 需要两个数字作为参数。当前，您正在传递一个将导致错误的字符串。因此，您需要将您的标记[i].metavalue 转换为两个数字，如下所示：

function setMarkers(map, markers) {
    for (var i = 0; i < markers.length; i++) {
    latlng = markers[i].meta_value.split(",")
    lat = parseFloat(latlng[0])
    lng= parseFloat(latlng[1])
        var marker = new google.maps.Marker({
            position:  new google.maps.LatLng(lat, lng),
            map: map
        });

        var contentString = "Some content";

        google.maps.event.addListener(marker, "click", function () {
            //infowindow.setContent(this.html);
            //infowindow.open(map, this);
        });
    }
}

如果您不想进行转换，您可以将 lat 和 lng 值作为数字存储在单独的属性中。所以你的 json 看起来像这样：

  var markers = [{
            "ID":"883",
            "post_title":"Tucker's Cafe",
            "meta_key":"meta_geo",
            "lat":41.1674377,
"lng": -73.2236554
        }

你会像这样添加一个标记：

var marker = new google.maps.Marker({
            position:  new google.maps.LatLng(markers[i].lat, markers[i].lng),
            map: map
        });

【讨论】：

太棒了！非常感谢！