Googleマップマルチマーカーが機能しない

Question

マップ上にマルチマーカーを表示したいが、それは1つだけになる。コンソールをチェックすると、すべての緯度と経度が表示されます。しかし、マーカーは1つだけです。

このコードは、私のPHPコードです。

$query="SELECT lat, lng, FROM mytable limit 5 offset $offset"; 
    $result = pg_exec($dbconn, $query); 
    $response = pg_fetch_all($result); 
    $data=json_encode($response, JSON_NUMERIC_CHECK | JSON_UNESCAPED_SLASHES | JSON_PRETTY_PRINT); 
    $data1 = json_decode($data, true); 

このコードは、私のjsコードとPHPコードです。

function initMap() { 
     <?php for($i=0; $i<5; $i++){ ?> 
    var myLatLng = {lat:<?=$data1[$i]['lat']?>, lng:<?=$data1[$i]['lng']?>}; 
    var map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 19, 
     center: myLatLng 
    }); 
    var marker = new google.maps.Marker({ 
     position: myLatLng, 
     map: map, 
     title: 'Hello World!' 
    }); 
     <?php } ?> 
    } 

Answer 1

マップをオーバーライドしてマップのinitをループの外に置くからだと思います。

function initMap() { 
    var center = {lat: -34.397, lng: 150.644}; 
    var map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 19, 
     center: center 
    }); 

    <?php for($i=0; $i<5; $i++){ ?> 
     var myLatLng = {lat:<?=$data1[$i]['lat']?>, lng:<?=$data1[$i]['lng']?>}; 

     var marker = new google.maps.Marker({ 
      position: myLatLng, 
      map: map, 
      title: 'Hello World!' 
     }); 
    <?php } ?> 
}