標記不顯示在谷歌地圖上API

我在wordpress上使用PHP & MYSQL來從數據庫中檢索包含Google Map上座標和顯示標記的數據。標記不顯示在谷歌地圖上API

Google地圖顯示，但沒有任何標記，我沒有在我的PHP代碼中發現錯誤。

代碼

 <?php 
      /* 
      Template Name: MAP2 
      */ 

      get_header(); 
     ?> 


    <!DOCTYPE html> 
    <html> 
     <head> 
     <title>Custom Markers</title> 
     <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no"> 
     <meta charset="utf-8"> 
     <script async defer 
     src="https://maps.googleapis.com/maps/api/js?key=*******&callback=initMap"> 
     </script> 

CSS CODE 
======== 


    <style> 
      /* Always set the map height explicitly to define the size of the div 
      * element that contains the map. */ 
      #map { 
      height: 600px; 
      } 
      /* Optional: Makes the sample page fill the window. */ 
      html, body { 
      height: 100%; 
      margin: 0; 
      padding: 0; 
      } 
     </style> 

    HTML code & javascript 
========================= 


</head> 
    <body> 
    <div id="map"></div> 
    <script> 

    var map; 
     function initMap() { 
     map = new google.maps.Map(document.getElementById('map'), { 
      zoom: 8, 
      center: new google.maps.LatLng(33.888630, 35.495480), 
      mapTypeId: 'roadmap' 
     }); 

     var iconBase = 'https://maps.google.com/mapfiles/kml/shapes/'; 
     var icons = { 
      parking: { 
      icon: iconBase + 'parking_lot_maps.png' 
      }, 
      library: { 
      icon: iconBase + 'library_maps.png' 
      }, 
      info: { 
      icon: iconBase + 'info-i_maps.png' 
      } 
     }; 

     function addMarker(feature) { 
      var marker = new google.maps.Marker({ 
      position: feature.position, 
      icon: icons[feature.type].icon, 
      map: map 
      }); 
     } 

     var features = [ 

PHP code 
======== 


    <?php 
       global $wpdb; 
       $prependStr =""; 
       foreach($wpdb->get_results("SELECT siteID, latitude, longitude FROM site_coordinates2", OBJECT) as $key => $row) { 
        $latitude = $row->latitude; 
        $longitude = $row->longitude; 
        $info = $row->siteID; 
       echo $prependStr; 
      ?> 
    { 
     position: new google.maps.LatLng(<?php echo $latitude; ?>, <?php echo $longitude; ?>), 
     type: '<?php echo $info; ?>' 
    } 
    <?php 
    $prependStr =","; 
    } 
    ?> 
      ]; 

      for (var i = 0, feature; feature = features[i]; i++) { 
       addMarker(feature); 
      } 
    } 

      </script> 


     </body> 
    </html> 

    <?php 
    get_footer(); 
    ?>

來源

2017-03-06 Jenny 3akra

可能沒有錯誤，因爲它沒有找到圖標。 'icon：圖標[feature.type] .icon，' –

@ H.Brendan所以如何解決這個錯誤？我評論類型並從** feature.type **中刪除，但仍然沒有任何工作 –

我認爲標記不知道位置是什麼。嘗試'位置：新的google.maps.LatLng（51.727681,4.9574324），'手動 - 只是嘗試把你的座標，而不是從數據庫中。如果它工作很難編碼它的東西與數據庫標籤 –

有可能是沒有錯誤becouse它沒有找到圖標。 icon: icons[feature.type].icon,所以試着看看。

我很高興能幫到你。

來源

2017-03-06 13:43:51

我會打開另一個問題信息窗口，因爲我試過了，它接縫不工作 –

你可以通過點擊鉤你應該這樣關閉這個。否則堆棧將mayham上「你有很多開放的問題」 –

和虐待嘗試幫助信息窗口，所以繼續前進，並打開新的問題:) –

生成變量的位置。

var locations = [ 
 
     ['Bondi Beach', -33.890542, 151.274856, 4], 
 
     ['Coogee Beach', -33.923036, 151.259052, 5], 
 
     ['Cronulla Beach', -34.028249, 151.157507, 3], 
 
     ['Manly Beach', -33.80010128657071, 151.28747820854187, 2], 
 
     ['Maroubra Beach', -33.950198, 151.259302, 1] 
 
    ]; 
 

 
    var map = new google.maps.Map(document.getElementById('map'), { 
 
     zoom: 10, 
 
     center: new google.maps.LatLng(-33.92, 151.25), 
 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
 
    }); 
 

 
    var infowindow = new google.maps.InfoWindow(); 
 

 
    var marker, i; 
 

 
    for (i = 0; i < locations.length; i++) { 
 
     marker = new google.maps.Marker({ 
 
     position: new google.maps.LatLng(locations[i][1], locations[i][2]), 
 
     map: map 
 
     }); 
 

 
     google.maps.event.addListener(marker, 'click', (function(marker, i) { 
 
     return function() { 
 
      infowindow.setContent(locations[i][0]); 
 
      infowindow.open(map, marker); 
 
     } 
 
     })(marker, i)); 
 
    }

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> 
 
    <title>Google Maps Multiple Markers</title> 
 
    <script src="http://maps.google.com/maps/api/js?sensor=false" 
 
      type="text/javascript"></script> 
 
</head> 
 
<body> 
 
    <div id="map" style="width: 500px; height: 400px;"></div> 
 

 
</body> 
 
</html>

來源

2017-03-06 07:49:47

我需要從數據庫檢索數據不是這些值，我生成 –

標記不顯示在谷歌地圖上API

回答

相關問題