クエリのデータを使用して複数のマーカーを作成できません

Question

データを照会すると、Googleマップ上にマーカーが1つしか表示されません。

何が最善の方法でしょうか？コーディングの初心者を助けてください。

<?php 
$query= mysqli_query($con,"SELECT imdb.STATION,imdb.PEIS,imdb.PGA,imdb.PGV, station.LAT, station.LON FROM imdb, station WHERE imdb.MAC = station.MAC and YYYYMMDD between '$from' and '$to'and HHMMSS between '$from1' and '$to1';"); 

while($row = mysqli_fetch_array($query)){ 

           $station = $row['STATION']; 
           $pei = $row['PEIS']; 
           $pga= $row['PGA']; 
           $pgv= $row['PGV']; 
           $lat = $row['LAT']; 
           $lon = $row['LON'];} 
?> 

<script type="text/javascript"> 

     function initMap() { 
    var myLatLng = {lat: <?php echo $lat; ?>, lng: <?php echo $lon; ?>}; 
    var map = new google.maps.Map(document.getElementById('map'), 
     {zoom: 4,center: myLatLng}); 

    var marker = new google.maps.Marker({ 
     position: myLatLng, 
     map: map, 
     title: 'Hello World!' 
    }); 
    } 
</script> 
<script async defer 
src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBM2-ikIyV0IMgQ31Rtpn_XBAMTm9wKup4&callback=initMap"> 
</script> 

Answer 1

OPは、私はそれを動作させるために適切なコードに差し込むことができます作業例を提供しています、尋ねたよう：

<?php 
$result = array(); 
while($row = mysqli_fetch_array($query)){ 
    $result[]['lat'] = $row['LAT']; 
    $result[]['lon'] = $row['LON']; 
} 
?> 

は、マップを初期化して作成するには、次のスクリプトを使用します。

<script type="text/javascript"> 

    var locationsJSON = '<?php echo json_encode($result) ?>'; 
    var locations = JSON.parse(locationsJSON); 

    var bounds = new google.maps.LatLngBounds(); 
    var map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 2, 
     center: new google.maps.LatLng(0, 0), 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }); 
    var marker, i; 
    for (i = 0; i < locations.length; i++) { 
     console.log(locations[i]); 
     var myLatLng = new google.maps.LatLng(locations[i][1], locations[i][2]); 
     bounds.extend(myLatLng); 
     map.fitBounds(bounds); 
     marker = new google.maps.Marker({ 
      position: myLatLng, 
      map: map 
     }); 
    } 
</script> 

Answer 2

Hi can you check on this code is this correct and i place the google map script at the top before the body part of the page 

<script type="text/javascript"> 

     function initMap() { 
var locationsJSON = '<?php echo json_encode($result) ?>'; 
var locations = JSON.parse(locationsJSON); 

var bounds = new google.maps.LatLngBounds(); 
var map = new google.maps.Map(document.getElementById('map'), { 
    zoom: 2, 
    center: new google.maps.LatLng(0, 0), 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
}); 
var marker, i; 
for (i = 0; i < locations.length; i++) { 
    console.log(locations[i]); 
    var myLatLng = new google.maps.LatLng(locations[i][1], locations[i][2]); 
    bounds.extend(myLatLng); 
    map.fitBounds(bounds); 
    marker = new google.maps.Marker({ 
     position: myLatLng, 
     map: map 
    }); 
    } 
    } 
</script> 

Answer 3

私はこのエラーを取得し続けるなぜあなたは確認することができます

警告：array_mapを（）：引数＃2は、あなたが `while`ループ内で定義した変数を上書きしている配列

$the_array = array();    
       while($row = mysqli_fetch_array($query)){ 

       $station = $row['STATION']; 
       $pei = $row['PEIS']; 
       $pga= $row['PGA']; 
       $pgv= $row['PGV']; 
       //$array_lat_lon[] = $lat = $row['LAT']; 
       //$array_lat_lon[] = $lon = $row['LON']; 
       $the_array[] = array($row['LAT'] . "," . $row['LON']) ;  
       //$timestamp = strtotime() 

       echo '<tr><td>'.$station.'</td><td>'.$pei.'</td><td>'.$pga.'</td><td>'.$pgv.'</td></tr>'; 
          } 
       //echo $lat.'<br>'; 
       //echo $lon.'<br>'; 
       //echo json_encode($the_array); 

       $location_array = json_decode('$the_array'); 
       $location_array = array_map('json_decode', $location_array[$the_array]); 
       echo $location_array; 
          } 
          } 
        ?>