如何使用php和mysql數據庫在谷歌地圖上顯示多個位置

-1

我有以下代碼，它工作正常，但只選擇一個位置，我有多個位置對'cid'，我想獲取並顯示所有位置。如何使用php和mysql數據庫在谷歌地圖上顯示多個位置

<head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
    <meta charset="utf-8"> 
    <title>Simple markers</title> 
    <style> 
     html, body { 
     height: 100%; 
     margin: 0; 
     padding: 0; 
     } 
     #map { 
     height: 100%; 
     } 
    </style> 
    </head> 
    <body> 
    <div id="map"></div> 
    <?php 
    $sql = "select * from locator_areas where cid=$city"; 
     $res = mysql_query($sql); 
      while($row=mysql_fetch_assoc($res)){ 
       ?> 
      <script> var myLatLng = {lat: <?php echo $row['latitude'] ?>, lng: <?php echo $row['longitude']?>};</script> 

<?php } ?> 
    <script> 
    function initMap() { 
     icon='img/bk-loc.png'; 
    var map = new google.maps.Map(document.getElementById('map'), { 
     zoom: 4, 
     center: myLatLng 
     }); 
     var marker = new google.maps.Marker({ 
      position: myLatLng, 
      map: map, 
      icon:icon, 
      title: "<?php echo $long.' || '. $lat?> " 
     }); 
     } 

    </script> 
    <script async defer 
    src="http://maps.googleapis.com/maps/api/js?key=myKEY&callback=initMap"> 
    </script> 

    <script> initMap();</script> 

    </body>

來源

2016-10-22 Saleem Jafar

您可以通過多次添加新的google.Maps.Marker（）添加多個標記。遍歷一個數組來做到這一點是有意義的。

來源

2016-10-22 09:43:12 user3492940

您正在一個變量中保存N個位置。在該變量中，只保存最後一個位置。如果你想在內存中保存N個位置，你必須使用一個數組。要將PHP變量發送到Javascript我建議使用PHP和PHP函數json_encode。

在你的例子的最後，你打電話給initMap。這是不需要的，因爲這個函數是從你的googleapis腳本包含中調用的。

重寫代碼應該是這樣的：

<body> 
    <div id="map"></div> 
    <?php 
    $sql = "select * from locator_areas where cid=$city"; 
    $res = mysql_query($sql); 


    $positions = array(); 
    while($row=mysql_fetch_assoc($res)){ 
     /* <script> var myLatLng = {lat: <?php echo $row['latitude'] ?>, lng: <?php echo $row['longitude']?>};</script>*/ 

     $positions[] = array(
      'lat' => $row['latitude'], 
      'lng' => $row['longitude'], 
      'title' => $row['longitude']. ' || ' .$row['latitude'] 
     ); 

    } 

    ?> 
    <script> 

     var positions = <?php echo json_encode($positions) ?>; 

    </script> 

    <script> 
     function initMap() { 
      icon='img/bk-loc.png'; 
      var map = new google.maps.Map(document.getElementById('map'), { 
       zoom: 4, 
       center: myLatLng 
      }); 

      positions.forEach(function(position){ 
       var marker = new google.maps.Marker({ 
        position: { 
         'lat' : position.lat, 
         'lng' : position.lng 
        }, 
        map: map, 
        icon:icon, 
        title: position.title 
       }); 
      }); 

     } 

    </script> 
    <script async defer src="http://maps.googleapis.com/maps/api/js?key=myKEY&callback=initMap"> 
    </script> 


</body>

來源

2016-10-22 09:44:32

的代碼看起來應該是這樣

<?php 
    require("phpsqlsearch_dbinfo.php"); 
    // Get parameters from URL 
    $center_lat = $_GET["lat"]; 
    $center_lng = $_GET["lng"]; 
    $radius = $_GET["radius"]; 

    // Start XML file, create parent node 
    $dom = new DOMDocument("1.0"); 
    $node = $dom->createElement("markers"); 
    $parnode = $dom->appendChild($node); 

    /Opens a connection to a mySQL server 
    $connection=mysql_connect (localhost, $username, $password); 
    if (!$connection) { 
    die("Not connected : " . mysql_error()); 
} 

// Search the rows in the markers table 
$query = sprintf("SELECT address, name, lat, lng, (3959 * acos(cos(radians('%s')) * cos(radians(lat)) * cos(radians(lng) - radians('%s')) + sin(radians('%s')) * sin(radians(lat)))) AS distance FROM markers HAVING distance < '%s' ORDER BY distance LIMIT 0 , 20", 
    mysql_real_escape_string($center_lat), 
    mysql_real_escape_string($center_lng), 
    mysql_real_escape_string($center_lat), 
    mysql_real_escape_string($radius)); 
$result = mysql_query($query); 

    $result = mysql_query($query); 
    if (!$result) { 
    die("Invalid query: " . mysql_error()); 
} 

    ?>

請查看以下鏈接https://developers.google.com/maps/articles/phpsqlsearch_v3 https://developers.google.com/maps/articles/phpsqlajax_v3

來源

2016-10-22 09:46:11 Ibrahim

你好，先生，我試過了，但沒有奏效。這沒有顯示 –

您可以通過添加多種添加多個標記次循環使用。遍歷一個數組來做到這一點是有意義的。

<head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
    <meta charset="utf-8"> 
    <title>Simple markers</title> 
    <style> 
     html, body { 
     height: 100%; 
     margin: 0; 
     padding: 0; 
     } 
     #map { 
     height: 100%; 
     } 
    </style> 
    </head> 
    <body> 
    <div id="map"></div> 
    <?php 
    $sql = "select * from locator_areas where cid=$city"; 
     $res = mysql_query($sql); 
      while($row=mysql_fetch_assoc($res)){ 
       $i=0; 
       ?> 


     <script> var myLatLng = new Array(); 
     myLatLng[<?php echo $i; ?>] = "<?php echo $value['latitude']; ?> , <?php echo $value['longitude']; ?>"; </script> 

<?php 
$i++; 
} ?> 
    <script> 

var locations = new Array(); 
      var latlngbounds = new google.maps.LatLngBounds(); 
      for (var i = 0; i < pins.length; i++) { 
       var coordinates = pins[i].split(", "); 
       locations[i] = new google.maps.LatLng(coordinates[0], coordinates[1]); 
       latlngbounds.extend(locations[i]); 
      } 

      var mapOptions = { 
       zoom: 9, 
       disableDefaultUI: true, 
       center: myLatlng, 
       draggable: false, 
       scrollwheel: false, 
       disableDoubleClickZoom: true, 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      } 
      map = new google.maps.Map(document.getElementById('map'), mapOptions); 

      //var contentString = "<p>I am HTML</p>"; 

      var image = 'img/bk-loc.png';    
      var markers = []; 
      for (var i = 0; i < locations.length; i++){ 
       markers[i] = new google.maps.Marker({ 
        position: locations[i], 
        map: map, 
        title: pin_quick_data[i], 
        icon: image 
       }); 
      } 
    </script> 
    <script async defer 
    src="http://maps.googleapis.com/maps/api/js?key=myKEY&callback=initMap"> 
    </script> 

    <script> initMap();</script> 

    </body>

來源

2016-10-22 10:11:12

如何使用php和mysql數據庫在谷歌地圖上顯示多個位置

回答

相關問題