添加谷歌地圖信息窗口動態Wordpress

我想添加一個谷歌地圖信息窗口動態地Wordpress，這是目前與自定義標記工作的代碼我已經嘗試了infowindows的幾個函數，但它似乎是打破和不加載地圖。不知道我可能會做錯什麼。添加谷歌地圖信息窗口動態Wordpress

這個作品我只需要添加一個信息窗口

<script type="text/javascript"> 
       //<![CDATA[ 

       function load() { 
       var styles = 
       [ 
        { 
         "stylers": [ 
         { "lightness": 1 }, 
         { "saturation": -76 }, 
         { "hue": "#3bff00" } 
         ] 
        } 
        ]; 


       var lat = <?php echo $lat; ?>; 
       var lng = <?php echo $lng; ?>; 
       // coordinates to latLng 
       var latlng = new google.maps.LatLng(lat, lng); 
       // map Options 

       var myOptions = { 

       zoom: 14, 
       scrollwheel: false, 
       center: latlng, 
       mapTypeId: 'Styled' 
       }; 

       //draw a map 
       var map = new google.maps.Map(document.getElementById("map"), myOptions); 
       var styledMapType = new google.maps.StyledMapType(styles, { name: 'Styled' }); 
       map.mapTypes.set('Styled', styledMapType); 
       var marker = new google.maps.Marker({ 
       position: map.getCenter(), 
       map: map, 
       icon: '/wp-content/themes/bills_theme/images/pin_bills.png', 
       }); 
       } 
       // call the function 
       load(); 
       //]]> 

      </script>

來源

2013-03-13 mariovass

我在代碼中沒有看到任何InfoWindow。請添加一些關於您嘗試的操作無效的信息，以及將在InfoWindow中顯示的數據來自何處。 – geocodezip 2013-03-13 18:08:04

簡單infowindow會（未測試）：

  //draw a map 
      var map = new google.maps.Map(document.getElementById("map"), myOptions); 
      var styledMapType = new google.maps.StyledMapType(styles, { name: 'Styled' }); 
      map.mapTypes.set('Styled', styledMapType); 
      var marker = new google.maps.Marker({ 
      position: map.getCenter(), 
      map: map, 
      icon: '/wp-content/themes/bills_theme/images/pin_bills.png', 
      }); 
      var infowindow = new google.maps.InfoWindow(); 
      google.maps.event.addListener(marker, "click", function(e) { 
      infowindow.setContent("Hello world"); 
      infowindow.open(map,marker); 
      }); 
      google.maps.event.trigger(marker, "click"); 
      } 
      // call the function

來源

2013-03-13 18:12:49 geocodezip

多數民衆贊成在工作IM恐懼:( – mariovass 2013-03-13 18:21:54

也許你可以回答我的問題上面，然後關於你的嘗試（除了上述）你有任何的JavaScript錯誤？infowindow工作，如果你點擊它？注意到一個錯字，其中我修好了，但應該給你一個錯誤。 – geocodezip 2013-03-13 18:25:38

只需添加以下代碼：

var contentString = 'put your content here.'; 
google.maps.event.addListener(marker, 'click', function() { 
    var infowindow = new google.maps.InfoWindow({ 
     content: contentString, 
     position: latlng, 
     maxWidth: 200 
     }); 
    infowindow.open(map); 
});

更多有關信息窗口的信息，您可以閱讀HERE。

來源

2013-03-15 06:41:19

添加谷歌地圖信息窗口動態Wordpress

回答

相關問題