在谷歌地图中将多个 php vars 放置为 lat/long答案

【问题标题】：Place multiple php vars as lat/long in Google Maps在谷歌地图中将多个 php vars 放置为 lat/long
【发布时间】：2014-02-02 07:55:49
【问题描述】：

这就是我所拥有的... PHP 从 API url 中提取了 10 对纬度/经度，我已经设法让它正常工作，但我似乎无法将它们绘制在带有多个标记为 1-10 的地图上。

我的php代码：

<?php
// Loading Domus API
    $url_search = 'http://url/site/go/api/search';
    $xml_search = @simplexml_load_file($url_search) or die ("no file loaded") ;
//Displaying latitude and longutude
$house = json_encode($house);
          }; ?>

JavaScript 位：

var locations = "<?php foreach($xml_search->property as $house) { echo $lat = $house->address->latitude , $long = $house->address->longitude;}; ?>";

var map = new google.maps.Map(document.getElementById('map'), {
  zoom: 10,
  center: new google.maps.LatLng(37.0625,-95.677068),
  mapTypeId: google.maps.MapTypeId.ROADMAP
});

var infowindow = new google.maps.InfoWindow();

var marker, i;

for (i = 0; i < locations.length; i++) {
  marker = new google.maps.Marker({
    position: new google.maps.LatLng(locations[i][1], locations[i][2]),
    map: map
  });

  google.maps.event.addListener(marker, 'click', (function(marker, i) {
    return function() {
      infowindow.setContent(locations[i][0]);
      infowindow.open(map, marker);
    }
  })(marker, i));
}

这里需要显示的内容

<div id="map" style="width: 500px; height: 400px"></div>

当然，我只是得到一个空白页。

【问题讨论】：

您是否遇到任何 JS 错误？您是否正确加载了 Google Maps API JS？你怎么称呼上面的JS；它是内联的，还是在你正在调用的函数中；如果是，怎么做？
不，我没有收到任何错误 - 只是一个空白页。我其实对 JS 了解不多。
那么上面的所有javascript都应该在一个函数中。这应该在窗口加载时调用，参见developers.google.com/maps/documentation/javascript/…
我遇到的问题是将 lat/long 从 php 解析为 javascript...
你怎么知道的？如果是这样，请尝试使用parseFloat(locations[i][1]) 等

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

【解决方案1】：

好的，我已经弄明白了。

这是我在头部的 php 代码

<?php
// Loading Domus API
$url_search = 'http://url/site/go/api/search';
$xml_search = @simplexml_load_file($url_search) or die ("no file loaded") ;?>

然后我有我的 javascript

// Load property ID followed by Lat and Long for each house (total of 10)
var locations = [<?php foreach($xml_search->property as $house) {
        echo '['.$house->id. ',' .$house->address->latitude. ',' .$house->address->longitude.'],';
        } ?>]; 

var map = new google.maps.Map(document.getElementById('map'), {
  zoom: 15,
  center: new google.maps.LatLng(0, 0),
  mapTypeId: google.maps.MapTypeId.ROADMAP
});

var infowindow = new google.maps.InfoWindow();

var marker, i;
var markers = new Array();

for (i = 0; i < locations.length; i++) {  
  marker = new google.maps.Marker({
    position: new google.maps.LatLng(locations[i][1], locations[i][2]),
    map: map
  });

  markers.push(marker);

  google.maps.event.addListener(marker, 'click', (function(marker, i) {
    return function() {
      infowindow.setContent(locations[i][0]);
      infowindow.open(map, marker);
    }
  })(marker, i));
}

function AutoCenter() {
  //  Create a new viewpoint bound
  var bounds = new google.maps.LatLngBounds();
  //  Go through each...
  $.each(markers, function (index, marker) {
  bounds.extend(marker.position);
  });
  //  Fit these bounds to the map
  map.fitBounds(bounds);
}
AutoCenter();

效果很好，现在只需要设置标记的标记就可以了。

【讨论】：