PHP를 사용하여 & MYSQL with WordPress 및 Google Map API를 사용하여 MYSQL 데이터베이스에서 데이터를 검색하고 Google Map에 정보창이있는 마커를 표시하십시오.Google Map에서 정보창과 마커를 추가하는 방법

문제는 데이터베이스에서 검색된 데이터 인 infoWindow를 siteID으로 표시 할 수 없다는 것입니다. 선택한 테이블의 필드는 어디입니까? 아래의 코드 마커를 사용하여

은지도에 보여되지 않습니다

코드 :

<?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=AIzaSyCquey2tCZ32jLJJDEEi2D7_RnXXyj9RTI&callback=initMap"> 
    </script> 
    <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> 

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

    <script> 

    var map,currentPopup; 
     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 popup = new google.maps.InfoWindow({ 
        // content: feature.position.toString(), 
// this line that makes the error 
       content: feature.info, 
        maxWidth: 300 
       }); 

      google.maps.event.addListener(marker, "click", function() { 
        if (currentPopup != null) { 
         currentPopup.close(); 
         currentPopup = null; 
        } 
        popup.open(map, marker); 
        currentPopup = popup; 
       }); 
       google.maps.event.addListener(popup, "closeclick", function() { 
        map.panTo(center); 
        currentPopup = null; 
       }); 
     } 



     var features = [ 
     <?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; ?>), 
    info:(<?php echo $info;?>), 

} 
<?php 
$prependStr =","; 
} 
?> 
     ]; 



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

      addMarker(feature); 
     } 
} 



     </script> 


    </body> 
</html> 

<?php 
get_footer(); 
?>

출처

2017-03-10 Jenny 3akra

대괄호를 info 매개 변수에 작은 따옴표로 바꿉니다. 감사. – user1544541

쿼리에서 좌표 (위도, 경도)를 얻고 있습니까? – user1544541

@ user1544541 예 답변이 작동합니다. –

이 정보 매개 변수에 대한 작은 따옴표와 괄호를 교체합니다. 감사.

출처

2017-03-10 13:23:26 user1544541

일반 마커 대신이 아이콘을 만드는 방법은 ?? 아이콘이 있지만 필요한 아이콘으로 아무것도 표시되지 않습니다. –

정교하게 말하십시오. 감사. – user1544541

일반 마커 대신 아이콘을 사용하여 코드에서 수행하는 방법 ?? 자바 스크립트 또는 PHP? –

Google Map에서 정보창과 마커를 추가하는 방법

코드 :

답변

관련 문제