添加標記點擊谷歌地圖API

Question

我有這個功能與谷歌地圖API添加標記。

是否有可能在href鏈接點擊上顯示標記信息？

我的標記加載動態地..

這一點到目前爲止我的代碼，但它不工作。

    <script type="text/javascript"> 
        var infowindow = new google.maps.InfoWindow(); 

        function addMarker(lat, lon, naam, straat, postcode, plaats, telefoon, afstand) 
        { 
         var marker = new google.maps.Marker({ 
          position: new google.maps.LatLng(lat, lon), 
          map: map, 
          icon: "afbeeldingen/pincard/wheel-icon.png", 
          title: naam 
         }); 

         google.maps.event.addListener(marker, 'click', function() { 
          var contentString = '<div>'+ 
          '<b style="border-bottom: 1px solid #000000;">' + naam + '</b><br/>'+ 
          'Afstand (hemelsbreed): ' + afstand + ' km<br/>' + 
          straat + '<br/>' + 
          postcode + ' ' + plaats + '<br/>'; 
          if(telefoon != "") 
          { 
           contentString = contentString + 'Telefoonnr: ' + telefoon; 
          } 
          contentString = contentString + '</div>'; 
          infowindow.setContent(contentString); 
          infowindow.open(map, marker); 
         }); 


        } 

        google.maps.event.addDomListener(window, 'load', initialize); 
       </script> 

這是我用的HREF：

<a href="javascript:google.maps.event.trigger(marker, 'click');">Click</a> 

任何幫助將受到歡迎:)

Answer 1

我得到了側邊欄的事情現在工作正常。 :)

這是我的最終代碼：

<script type="text/javascript"> 
         var geocoder; 
         var map; 
         var side_bar_html = ""; 
         var gmarkers = []; 
         var infobox; 
         function initialize() { 

    var blueOceanStyles = [ 
    { 
     featureType: "all", 
     elementType: "all", 
     stylers: [ 
     { saturation: -100 } // <-- THIS 
     ] 
    } 
]; 

          geocoder = new google.maps.Geocoder(); 
          var myOptions = { 
           zoom: <?php 
           if(is_array($postcodevelden) && count($postcodevelden) > 0 && !empty($_POST['address'])) 
           { 
            switch($radius) 
            { 
             case "5": 
              echo "12"; 
              break; 
             case "10": 
              echo "11"; 
              break; 
             case "15": 
             case "20": 
              echo "10"; 
              break; 
             case "30": 
             case "40": 
              echo "9"; 
              break; 
            } 
           } 
           else 
           { 
            echo "7"; 
           } 
           ?>, 
           center: new google.maps.LatLng(<?php if(is_array($postcodevelden) && count($postcodevelden) > 0) { echo $lat.", ".$lon; } else { echo "52.2008737173322, 5.25146484375"; } ?>),    
          mapTypeId: google.maps.MapTypeId.ROADMAP 
          } 
          map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
          map.setOptions({styles: blueOceanStyles}); 

<?php 
     if(is_array($adressen) AND count($adressen) > 0) 
     { 
      foreach($adressen as $adres) 
      { 
       $afstand = round((6371 * acos(sin(deg2rad($lat)) * sin(deg2rad($adres->locatie_lat)) + cos(deg2rad($lat)) * cos(deg2rad($adres->locatie_lat)) * cos(deg2rad($adres->locatie_lon) - (deg2rad($lon))))), 2); 
?> 
          addMarker(<?php echo $adres->locatie_lat.", ".$adres->locatie_lon.", '".$adres->locatie_naam."', '".$adres->locatie_straat."', '".$adres->locatie_postcode."', '".$adres->locatie_plaats."', '".$adres->locatie_telefoon."', '".$afstand."'"; ?>); 
<?php 
      } 
     } 
?> 
document.getElementById("marker_list").innerHTML = side_bar_html; 
         } 
         function myclick(i) { 
    map.setCenter(gmarkers[i].getPosition()); 
    google.maps.event.trigger(gmarkers[i], "click"); 
} 
          infowindow = new InfoBox({ 
          content: document.getElementById("infobox"), 
          disableAutoPan: false, 
          maxWidth: 150, 
          pixelOffset: new google.maps.Size(-140, 0), 
          zIndex: null, 
          boxStyle: { 
           background: "url('http://google-maps-utility-library-v3.googlecode.com/svn/trunk/infobox/examples/tipbox.gif') no-repeat", 
           opacity: 0.95, 
           width: "280px" 
          }, 
          closeBoxMargin: "12px 4px 2px 2px", 
          closeBoxURL: "http://www.google.com/intl/en_us/mapfiles/close.gif", 
          infoBoxClearance: new google.maps.Size(1, 1) 
         }); 

         function addMarker(lat, lon, naam, straat, postcode, plaats, telefoon, afstand) 
         { 
          var marker = new google.maps.Marker({ 
           position: new google.maps.LatLng(lat, lon), 
           map: map, 
           icon: "afbeeldingen/pincard/wheel-icon.png", 
           title: naam 
          }); 

          google.maps.event.addListener(marker, 'click', function() { 
           var contentString = '<div id="infobox">'+ 
           '<b style="border-bottom: 1px solid #f6ee34; color:#ee2a24;">' + naam + '</b><br/>'+ 
           'Afstand (hemelsbreed): ' + afstand + ' km<br/>' + 
           straat + '<br/>' + 
           postcode + ' ' + plaats + '<br/>'; 
           if(telefoon != "") 
           { 
            contentString = contentString + 'Telefoonnr: ' + telefoon; 
           } 
           contentString = contentString + '</div>'; 
           infowindow.setContent(contentString); 
           infowindow.open(map, marker); 
          }); 
           gmarkers.push(marker); 

    side_bar_html += '<tr>'+ '<td onclick="javascript:myclick(' + (gmarkers.length-1) + ')"><a>' + naam + '<br/>' + straat + '<br/>' + postcode + ' ' + plaats + '<br/>' + 'Afstand ' + afstand + ' km' +'</td>' +'<\/a></tr><br>'; 

         } 

         google.maps.event.addDomListener(window, 'load', initialize); 
        </script> 

我得到的範圍內的所有郵編，該用戶輸入的完整列表。現在我無法弄清楚如何在邊欄中對輸出進行排序，但這是另一個問題。