動態添加圖像到Infowindow

Question

我想知道是否有人能夠幫助我。

我用下面的代碼加載圖像到HTML頁面，這是pertient到當前的「位置」和「用戶」的ID。

<div id="galleria"> 
        <?php 
        $dirlist = getFileList($galleryPath, true); 
        $x = 0; 
        foreach($dirlist as $file) { 
         if((preg_match("/\.jpg$/", $file['name'])) or (preg_match("/\.jpeg$/", $file['name'])) or (preg_match("/\.png$/", $file['name'])) or (preg_match("/\.bmp$/", $file['name'])) or (preg_match("/\.gif$/", $file['name']))) { 
          echo "<img src='{$file['name']}' />"; 
          $x = 1; 
         } 
        } 
        if ($x == 0) { 
         echo "<img src='images/noimage.jpg' />"; 
        } 
        ?> 
       </div> 

這工作正常，但我有兩個方面的困難。我試圖僅顯示第一張圖片，並將該圖片放在「Infowindow」而不是主頁面上。但我必須絕對誠實，並說我甚至不知道從哪裏開始。爲了達到這一點，我花了幾天的時間。

下面的代碼是摘錄從創建標記和Infowindow的腳本。

downloadUrl("loadlocationfinds.php?locationid=<?php echo $lid?>", function(data) { 
      var xml = data.responseXML; 
      var markers = xml.documentElement.getElementsByTagName("marker"); 
      var bounds = new google.maps.LatLngBounds(); 
      for (var i = 0; i < markers.length; i++) { 
      var findid = markers[i].getAttribute("findid"); 
      var locationid = markers[i].getAttribute("locationid"); 
      var findosgb36lat = markers[i].getAttribute("findosgb36lat"); 
      var findosgb36lon = markers[i].getAttribute("findosgb36lon"); 
      var findcategory = markers[i].getAttribute("findcategory"); 
      var point = new google.maps.LatLng( 
      parseFloat(markers[i].getAttribute("findosgb36lat")), 
      parseFloat(markers[i].getAttribute("findosgb36lon"))); 
      var html = "<span class='h3 orange'><strong>" + 'Item Found: ' + "</strong></span><br>" + finddescription + "<br>"; 
      var icon = customIcons[findcategory] || {}; 
      var marker = new google.maps.Marker({ 
      map: map, 
      position: point, 
      title: 'Click to view details', 
      icon: icon.icon, 
      shadow: icon.shadow, 
      formfindosgb36lat: findosgb36lat, 
      formfindosgb36lon: findosgb36lon, 
      formfindcategory: findcategory, 
      }); 
      bounds.extend(point); 
      map.fitBounds(bounds); 
      bindInfoWindow(marker, map, infoWindow, html); 
      google.maps.event.addListener(marker, "click", function() { 
      document.getElementById('findosgb36lat').value = this.formfindosgb36lat; 
      document.getElementById('findosgb36lon').value = this.formfindosgb36lon; 
      document.getElementById('findcategory').value = this.formfindcategory; 
      }); 
      } 
      }); 
      } 

      function bindInfoWindow(marker, map, infoWindow, html) {  
      google.maps.event.addListener(marker, 'click', function() {   
      infoWindow.setContent(html);   
      infoWindow.open(map, marker, html);  
      }); 
      } 

我只是想知道是否有人也許可以看看這個，請，並提供一點點幫助，使我能夠在「Infowindwow」中只顯示前圖像。

非常感謝和最親切的問候

Answer 1

的圖像被添加到信息窗口的HTML

即

........................ 
var html = "<span class='h3 orange'><strong>" + 'Item Found: ' + "</strong></span><br>" +  finddescription + "<br>"; 
html+= "<img src=\"image.jpg\" alt=\"My Image\" height=\"Ypx\" width=\"Xpx\"><br>"; 
........................ 

凡X和ÿ是整數