Карты Google (api v3) - перебирайте результаты запросов mysql для геокодирования и размещайте несколько маркеров на карте. - PullRequest
0 голосов
/ 06 февраля 2012

У меня есть карта Google на странице результатов поиска, которые показывают до 20 списков.20 списков взяты из запроса MySQL и зациклены на странице.Эта часть работает нормально.

Тем не менее, карта Google (которая также геокодирует адреса для меня), показывает только первый список.Я в недоумении, как сделать так, чтобы он просматривал все списки и помещал их все на карту.

Я уверен, что все это будет легко понять и понять, как только я получу его, но я просто нене хватает отбивных, чтобы все заработало с нуля.Документы Google для разработчиков также не сильно помогли ....

Любая помощь очень ценится !!

********* ОБНОВЛЕНИЕ К ВОПРОСУ *******

Ответ при условии, что я не мог видеть, как работать .... проблема была в том, что до исправления на странице отображались все списки, но отображались только 1. После реализации ответа, на странице отображается только первый список, а карта вообще не отображается.

Я сделал урезанную версию A & B.Это в основном полная вставка всего кода страницы:

ВЕРСИЯ 1: Здесь отображаются все записи на странице, но отображается только первый список:

<?php
mysql_select_db($database_db, $db);
$query_my_query = "SELECT * FROM biz WHERE state = 'MO' and city = 'springfield' order by name asc limit 0,5 ";
$my_query = mysql_query($query_my_query, $db) or die(mysql_error());
$row_my_query = mysql_fetch_assoc($my_query);
$totalRows_my_query = mysql_num_rows($my_query);

$address = $row_my_query['address'];
$city = $row_my_query['city'];
$state = $row_my_query['state'];

?>
<script type="text/javascript" src="//maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
  var geocoder;
  var map;
  function initialize() {
    geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(34.052234,-118.243685);
    var address = '<?php echo $address.', '.$city.', '.$state; ?>';

    var myOptions = {
      zoom: 14,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
    geocoder.geocode( { 'address': address}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        map.setCenter(results[0].geometry.location);
        var marker = new google.maps.Marker({
            map: map, 
            position: results[0].geometry.location
        });
      } else {
        alert("Geocode was not successful for the following reason: " + status);
      }
    });
  }
</script>
<head>
<title>TEST</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" >
</head>
<body onload="initialize()">
        <div>
                <?php do { // horizontal looper?>
                    <?php echo $row_my_query['name'].' '.$row_my_query['address'].' '.$row_my_query['city'].', '.$row_my_query['state']; ?>
                    <?php echo substr($row_my_query['zip'],0,5); ?><br>
                <?php $row_my_query = mysql_fetch_assoc($my_query);
                } while ($row_my_query); //end horizontal looper ?> 
            </div>
        <div id="map_canvas" style="width: 300px; height: 300px;"></div>
</body>
</html>

ЗДЕСЬ V2:В результате отображается только 1 листинг на странице, и карта вообще не работает:

<?php
mysql_select_db($database_db, $db);
$query_my_query = "SELECT * FROM biz WHERE state = 'MO' and city = 'springfield' order by name asc limit 0,5 ";
$my_query = mysql_query($query_my_query, $db) or die(mysql_error());
$row_my_query = mysql_fetch_assoc($my_query);
$totalRows_my_query = mysql_num_rows($my_query);

$address = $row_my_query['address'];
$city = $row_my_query['city'];
$state = $row_my_query['state'];

?>
<script type="text/javascript" src="//maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
  var geocoder;
  var map;
  function initialize() {
    geocoder = new google.maps.Geocoder();
    var latlng = new google.maps.LatLng(34.052234,-118.243685);

        var addresses = [];
        <?php while ($row = mysql_fetch_assoc($my_query)) { ?>
        addresses.push(<?php echo '"' . $row['address'].', '.$row['city'].', '.$row['state'] . '"'; ?>);
        <?php } ?>


    var myOptions = {
      zoom: 14,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
for(i in addresses) {
    var address = addresses[i];
    geocoder.geocode( { 'address': address}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            map.setCenter(results[0].geometry.location);
            var marker = new google.maps.Marker({
                map: map, 
                position: results[0].geometry.location
            });
        } else {
            // alert("Geocode was not successful for the following reason: " + status);
        }
    });
  }
</script>
<head>
<title>TEST</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" >
</head>
<body onload="initialize()">
        <div>
                <?php do { // horizontal looper?>
                    <?php echo $row_my_query['name'].' '.$row_my_query['address'].' '.$row_my_query['city'].', '.$row_my_query['state']; ?>
                    <?php echo substr($row_my_query['zip'],0,5); ?><br>
                <?php $row_my_query = mysql_fetch_assoc($my_query);
                } while ($row_my_query); //end horizontal looper ?> 
            </div>
        <div id="map_canvas" style="width: 300px; height: 300px;"></div>
</body>
</html>

Пожалуйста, помогите !!Я не могу понять, как решить эту проблему, но знаю, что ответ должен быть как-то прямо передо мной.

Спасибо, как всегда ....

1 Ответ

2 голосов
/ 06 февраля 2012

1) Вам необходим цикл PHP для итерации набора результатов из запроса, а затем создания массива адресов javascript.

Заменить строку:

var address = '<?php echo $address.', '.$city.', '.$state; ?>';

с ...

var addresses = [];
<?php while ($row = mysql_fetch_assoc($my_query)) { ?>
addresses.push(<?php echo '"' . $row['address'].', '.$row['city'].', '.$row['state'] . '"'; ?>);
<?php } ?>

2) Оберните цикл javascript вокруг вызова функции geocoder.geocode, чтобы перебрать массив адресов, который вы только что сгенерировали.

* * 1010

Надеюсь, это имеет смысл!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...