1

我试着让我的地图工作一个多月了。我已经阅读了很多帖子，但无法使其 100% 正常工作。我从这里尝试了各种建议。到目前为止，集群标记有效，显示/隐藏标记类型有效。问题是我无法使用循环获取每个标记的动态信息窗口。到目前为止，如果我使用位置 [i] [0] 作为名称等，我可以获得数据。主要问题是我需要在信息窗口中有指向详细信息页面的链接。没有这种能力，这张地图就没有意义。如果有人可以提供一些建议或解决方案，那就太棒了。

当我在 infowindow.setContent 中使用时，contentInfoWindow 会制动信息窗口。infowindow.setContent 仅在像这样infowindow.setContent(locations[i][0]);用于显示名称时才有效。我可以添加更多位置数组，但这不是我需要的。

这是完整的代码。

function getHtmlInfoWindow($item)
    {
    if($item->imagename!=NULL){ $img=$item->imagename->name;}else{$img='noimage.jpg';}
   $myHtml='';
   $myHtml .='<div id="propertydetail"><div class="title">';
   $myHtml .='<a target="_parent" href="'. $item->link.'" title="'.str_replace('"',' ',$item->name).'">'.$item->name.'</a></div>';
   $myHtml .='<div class="image"><img src="images/properties/images/thumbs/'.$item->id.'/'.$img.'" alt="'.str_replace('"',' ',$item->name).'" width="100" height="75"></div>';
   $myHtml .='<div class="text">';
    if ($item->name_type) {
      $myHtml .=JText::_($item->name_type).'<br />';
   }
   if ($item->name_category) {
      $myHtml .=JText::_($item->name_category).'<br />';
   }
   if ($item->name_locality) {
      $myHtml .=JText::_($item->name_locality).'<br />';
   }
   if ($item->address) {
      $myHtml .=JText::_($item->address).'<br />';
   }
   $myHtml .='</div>';
   $myHtml .='<div class="property_button">';
   $myHtmlimg ='<a target="_parent" class="BottomlnkDetail" href="'.$item->link.'" title="'.$item->id.'">'.JText::_('MOD_PROP_MAP_VIEW_DETAILS').'</a>';
   //$myHtml .='<button type="button" id="sbox-btn-close" onclick="window.parent.document.getElementById(\\\'sbox-window\\\').close();window.close();">Cancelar</button>';
   $myHtml .='</div>';
   $myHtml .='</div>';
    return $myHtml;
    }

   $useTranslations=$cParams->get('useTranslations','0');
   if($useTranslations)
    {
      $lang =& JFactory::getLanguage();
      $thisLang = $lang->getTag();
    }else{
      $thisLang  = NULL;
    }
   $item=$list[0];
   $MapDistance=$params->get('MapDistance',14);
   $lat = $item->lat;
   $lng = $item->lng;
?>



 <div id="map" style="width: 100%; height: 500px;"></div>

<fieldset id="form">
   <p>
    <input class="checkbox" id="1" name="1" type="checkbox" checked="checked" value="1" />
    <label for="1"><?php echo JText::_('APARTMENT');?></label>
    </p>
    <p>
    <input class="checkbox" id="2" name="2" type="checkbox" checked="checked" value="2" />
    <label for="2"><?php echo JText::_('ROOM');?></label>
    </p>
    <p>
    <input class="checkbox" id="3" name="3" type="checkbox" checked="checked" value="3" />
    <label for="3"><?php echo JText::_('HOUSE');?></label>
    </p>
    <p>
    <input class="checkbox" id="4" name="4" type="checkbox" checked="checked" value="4" />
    <label for="4"><?php echo JText::_('HOTEL');?></label>
    </p>

</fieldset>

<script src="http://maps.google.com/maps/api/js?sensor=false&language=<?php echo $thisLang;?>" type="text/javascript"></script>
<script type="text/javascript" src="modules/mod_prop_map/tmpl/markerclusterer.js"></script>

    <script type="text/javascript">


    var contentInfoWindow=new Array();
    <?php
        for($x=0;$x<count($list);$x++)
            {
            echo "\n"."contentInfoWindow[".$x."]='".getHtmlInfoWindow($list[$x])."';"."\n";
            }
        ?>



 var markers = new Array();
    var locations = [
     <?php
        for($x=0;$x<count($list);$x++)
            {
            $product = $list[$x];
            echo "['".$product->name."',".$product->type.",".$product->lat.",".$product->lng.",".$x."],"."\n";
            }
        ?>
    ];



var mcOptions =
    {
        gridSize: 50//, maxZoom: 6
    };

    var map = new google.maps.Map(document.getElementById('map'), {
      zoom: <?php echo $MapDistance;?>,
          scrollwheel: true,
      center: new google.maps.LatLng(<?php echo $lat;?>, <?php echo $lng;?>),
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });


var markerCluster = null;   // Initializes markerCluster
    var markers = []; 
    var marker, i;

    for (var i = 0; i < locations.length; i++) {
      marker = new google.maps.Marker({
        position: new google.maps.LatLng(locations[i][2], locations[i][3]),
        map: map,
        icon: '<?php echo JURI::base()?>components/com_properties/includes/img/map_'+locations[i][1]+'_marker.png'

      });


        markers.push(marker);
        map.setCenter(marker.getPosition());    





var infowindow = new google.maps.InfoWindow();
google.maps.event.addListener(marker, 'click', (function(marker, i) { return function() {


infowindow.setContent(locations[i][0]);
          infowindow.open(map, marker);
          //zIndex: locations[i][1]
        }
      })(marker, i));
    }

var markerCluster = new MarkerClusterer(map, markers);


    // == shows all markers of a particular category, and ensures the checkbox is checked ==
      function show(type) {
        for (var i=0; i<locations.length; i++) {
          if (locations[i][1] == type) {
            markers[i].setVisible(true);
          }
        }
      }

      // == hides all markers of a particular category, and ensures the checkbox is cleared ==
      function hide(type) {
        for (var i=0; i<locations.length; i++) {
          if (locations[i][1] == type) {
            markers[i].setVisible(false);
          }
        }
      }



         (function($){

      // == show or hide the categories initially ==


        $(".checkbox").click(function(){
            var types = $(this).attr("value");

            // If checked
            if ($(this).is(":checked"))
            {
                show(types);
            }
            else
            {
                hide(types);
            }
          });
         })(jQuery);

</script>
4

0 回答 0