2017-11-18 6 views
-2

私は、MySQL DBから緯度と長い値をフェッチし、地図上に表示する位置マーカーをGoogleマップ上でそれらの値を渡すために試してみる

が、現在、私は最後の行のデータしか取得していないので、マーカーを1つだけ示します。 マップ上のすべての場所を表示する方法は?

<?php 
include "config.php"; 
$result="select * from ds_duty_history"; 
$a=mysqli_query($conn,$result); 
// $count_row = mysqli_num_rows($a); 
while ($b = mysqli_fetch_array($a)) { 
    $long_d=$b['lng']; 
    $lat_d=$b['lat']; 
    $result = array(array('latitude'=>$lat_d,'longitude'=>$long_d)); 
} 
?> 
<!doctype html> 
<html> 
    <head> 
     <script async defer 
    src="https://maps.googleapis.com/maps/api/js?key=YOURKEY&callback=initMap"> 
    </script> 
     <script type="text/javascript"> 
     var map; 
     function initialize() { 
      // Set static latitude, longitude value 
      var latlng = new google.maps.LatLng(<?php echo $lat_d; ?>, <?php echo $long_d; ?>); 
      // Set map options 
      var myOptions = { 
       zoom: 16, 
       center: latlng, 
       panControl: true, 
       zoomControl: true, 
       scaleControl: true, 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      } 
      // Create map object with options 
      map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
     <?php 
      // uncomment the 2 lines below to get real data from the db 
      // $result = mysql_query("SELECT * FROM parkings"); 
      // while ($row = mysql_fetch_array($result)) 
      foreach($result as $row){ // <- remove this line 
       echo "addMarker(new google.maps.LatLng(".$row['latitude'].", ".$row['longitude']."), map);";} 
     ?> 
     } 
     function addMarker(latLng, map) { 
      var marker = new google.maps.Marker({ 
       position: latLng, 
       map: map, 
       draggable: true, // enables drag & drop 
       animation: google.maps.Animation.DROP 
      }); 

      return marker; 
     } 
     </script> 

    </head> 
    <body onload="initialize()"> 
     <div style="float:left; position:relative; width:550px; border:0px #000 solid;"> 
      <div id="map_canvas" style="width:550px;height:400px;border:solid black 1px;"></div> 
     </div> 

    </body> 
</html> 

現在、唯一のマーカーすなわち、最後の緯度、レコードフェッチと長い、MySQLの緯度を使用して地図上に長い値をすべての場所を表示する方法をマップ に割り当てる表示?

+0

「最後の行」とは、「ORDER BY datetime DESC LIMIT 10」のような意味ですか? –

+0

のテーブルには緯度と経度の値があり、それらは異なる場所のような1つ以上のレコードであり、これらの緯度と経度の値を使用してマップ上に表示位置を持っています.....このコードを使用して、 。だから、どのように地図上のすべての場所を表示する? –

答えて

0

マップ

<script type="text/javascript"> 
     var LocationData = <?php echo json_encode($result); ?>; 
     function initialize() 
     { 
     var myOptions = {zoom:12,mapTypeId: google.maps.MapTypeId.ROAD}; 
     var map = 
     new google.maps.Map(document.getElementById('map-canvas'), myOptions); 
     var bounds = new google.maps.LatLngBounds(); 
     var infowindow = new google.maps.InfoWindow(); 
     for (var i in LocationData) 
     { 
      var p = LocationData[i]; 
      var latlng = new google.maps.LatLng(p[0], p[1]); 
      bounds.extend(latlng); 

      var icon = { url: '<?php echo base_url();?>assets/frontend/assets/images/location_pin1.png', // url  
      scaledSize: new google.maps.Size(40, 70), // scaled size  
      origin: new google.maps.Point(0,0), // origin  
      anchor: new google.maps.Point(0, 0) // anchor 
      }; 

      var marker = new google.maps.Marker({ 
      position: latlng, 
      map: map, 
      draggable: true, // enables drag & drop 
      animation: google.maps.Animation.DROP 
      icon: icon 
      }); 


      google.maps.event.addListener(marker, 'click', function() { 
      window.location.href = this.url; 
      }); 

     } 
     map.fitBounds(bounds); 
     } 
     google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 
+0

答えとしてコードを投げ捨てるのを避けて、その動作とその理由を説明しようとしてください。関連するコーディング経験を持っていない人にとっては、あなたのコードは明らかではないかもしれません。 [明確化、文脈を含めるように答えを編集し、あなたの答えに何らかの制限、前提条件、簡略化を含めるようにしてください。](https://stackoverflow.com/help/how-to-answer) –

+0

var LocationData = <? PHPエコーjson_encode($結果); ?>;あなたの答えのコードでは..私はデータベースからの異なる場所の緯度と経度の値を取得しようとし、マップ上のすべての場所の表示。 ..現在、地図上には1つの場所マーカーの表示しかありません...地図上のすべての場所を表示するためにループを使用してみます –

1

に表示複数のマーカーのために、このコードを試してみてください、あなたがここに持っている主な問題は、あなたが実際にあなたの$result変数に異なる結果を収集しますが、最新のものでそれを上書きしていないということです。あなたの混乱に寄与している変数$resultの悪用もあるようです。新しいarrayと宣言し、それを$rowsとしましょう。その後、我々は、(あなたの最初のスニペットに置き換えて)次のコードですべて行を収集することができます。お使いのディスプレイのコードで今すぐ

<?php 
include "config.php"; 

$sql = "SELECT * FROM ds_duty_history"; 
$result = mysqli_query($conn, $sql); 
$rows = []; 
while ($row = mysqli_fetch_array($result)) { 
    $lon_d = $row['lng']; 
    $lat_d = $row['lat']; 
    // Use short-cut append syntax here so we add row and don't overwrite $rows 
    $rows[] = ['latitude' => $lat_d, 'longitude' => $long_d]; 
} 
?> 

(第2スニペットを)あなたのような、かなり$rowsを反復することができるだろう。ただ、脇など

foreach ($rows as $row){ 
    // Do work with each $row here 
} 

、できるだけ有意義であり、あなたはできる限り新しい変数を使用する変数名を使用してに慣れるようにしてください。 $aのような短い一般的な変数名を使用しようとすると、いつもそれを宣言した場所を見つけない限り、その変数が何を表しているか分からないので、常に混乱を招きます。 (あなたが$resultで行ったように)変数を再利用しようとすると、変数への代入が見つかったとしても今までよりはるかに難しくなります。多くの異なる時間が割り当てられています。毎回タイプします。あなたは自身のコードを読んでいるときに、自身のの意図を読んで理解することができますので、この1つのことをすれば、プログラミングが簡単になります。

関連する問題