谷歌地圖多地圖Bootsrap莫代爾沒有工作

Question

我正在開發一個網站，可以查看用戶的位置和繪製地圖從他們的座標，我使用模態來顯示地圖，如果我使用一個經度和緯度（一個用戶在數據庫中）地圖顯示完美，但如果我使用數據庫中的多個數據（數據庫中有超過1個用戶），地圖不顯示，我無法弄清楚問題是什麼，所以任何人都可以幫助我？ 下面的代碼：

while($u=mysqli_fetch_array($query)){ 
//$coordinate format from database is 123.456,789.876 
$latlng = explode(",",$coordinate); 
$lat = $latlng[0]; 
$lng = $latlng[1]; 
echo " 
<tr> 
    <td> 
    <script src='https://maps.googleapis.com/maps/api/js?callback=init$modal'></script> 
    <script type='text/javascript'> 
     function init$modal() { 
      var map$modal; 
      var latlng$modal = {lat: $lat, lng: $lng}; 
      var myOptions = { 
       zoom: 16, 
       center: latlng$modal, 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      } 
      map$modal = new google.maps.Map(document.getElementById('map_canvas$modal'),myOptions); 

      var marker = new google.maps.Marker({ 
      position: latlng$modal, 
      map: map$modal 
      }); 


      $('#myModal$modal').on('shown.bs.modal', function(e) { 
       google.maps.event.trigger(map, 'resize'); 
       return map.setCenter(latlng$modal); 
      }); 
     } 
    </script> 
    <div class='modal fade' id='myModal$modal' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'> 
     <div class='modal-dialog'> 
     <div class='modal-content'> 
      <div class='modal-header'> 
      <button type='button' class='close' data-dismiss='modal' aria-hidden='true'>&times;</button> 
      </div> 
      <div class='modal-body datauser'> 
      <table class='table'> 
       <tr> 
        <td style='vertical-align: top;'> 
         <div class='mapcaller' id='map_canvas$modal' style='width:100%; height:250px;'></div> 
        </td> 
       </tr> 
      </table> 
      </div> 
     </div> 
     </div> 
    </div> 

    <button type='button' data-toggle='modal' data-target='#myModal$modal' class='btn btn-default btn-sm' style='float: right; margin-right: 5px; margin-left: 5px;'> 
     <i class='fa fa-info-circle'></i> See data 
    </button> 
    </td> 
</tr>"; 
$modal+=1; 

我使用的是引導的模式，因此地圖是模態循環裏面，你的答案，將不勝感激。

Answer 1

不，這是行不通的。你不能在php循環中定義javascript函數，這會弄亂一切。

設置1個init（）函數，只是在不放入php變量的情況下進行回顯。你應該做的是使用while循環來生成1個數據數組。您可以輸入該功能的數據。

事情是這樣的：

<?php 
$locations = array(); 
while($u = mysqli_fetch_array($query)) { 
    $latlng = explode(",", $u); 
    $locations[] = array('lat'=>$latlng[0], 'lng'=>$latlng[1]); 
} 
// this turns a php array (or object) in a string. That string can be read by javascript. 
$locations_json = json_encode($locations); 
// now we make a javascript variable that contains this data. 
echo '<script> 
    // global variable, you can access this data anywhere in the javascript 
    var locations = ' . $locations_json . '; 
</script>'; 
?> 
<script> 
function init() { 
    // etc. 
} 
// etc. 
</script> 

現在，我不知道情態;但我可以告訴你：只需製作javascript，確保沒有php（或其他）變量或javascript函數內的任何內容。