谷歌地图API，将搜索和标记Infowidget

我使用谷歌地图和谷歌搜索的地方，我有两个问题。谷歌地图API，将搜索和标记Infowidget

1 - 我想infowidget，当我们从移动的标志远继续开放。这意味着所有的信息窗口将继续开放，如果标记已被上空盘旋，现在它的另一个标志的窗口打开时关闭一个标记窗口。

2，我得到几个搜索结果的地方。例如寻找给出的堪萨斯城的经纬度麦当劳的时候，它给了我只有一个结果。代码在这里。

function initialize() 
{ 
    var lat; 
    var longitude; 
    var zoom; 
    var radius_hidden=document.getElementById("hidden_radius").value; 
    var searchname=document.getElementById("hidden_searchname").value; 
    if(trim(document.getElementById("longitude").value)!="") 
    { 
     zoom=11; 
     lat=document.getElementById("latitude").value; 
     longitude=document.getElementById("longitude").value; 
    } 
    else 
    { 
     zoom=11; 
     longitude="-88"; 
     lat="42"; 
    } 
    latlng = new google.maps.LatLng(lat,longitude); 
    var myOptions = { 
     zoom: zoom, 
     center: latlng, 
     mapTypeId: google.maps.MapTypeId.ROADMAP 
    }; 

    map = new google.maps.Map(document.getElementById("map"), myOptions); 


    //alert("Radius:"+radius_hidden); 
    var requestsearch = { 
     location: latlng, 

     name: searchname, 
     types: ['store'], 
     bound:latlngbounds, 
     rankBy: google.maps.places.RankBy.DISTANCE 
    }; 
    // keyword: searchname,//name: searchname, to get like pages and name to get exact 
    service = new google.maps.places.PlacesService(map); 
    //service.textSearch(requestsearch, callback); 
    service.search(requestsearch, callback); 

    if(map != null) { 
     google.maps.event.addListener(map, 'drag', function(event) { 
      calculateCenter(); 
     }); 
    } 
} 
google.maps.event.addDomListener(window, 'load', initialize); 


google.maps.event.addDomListener(window, 'resize', function() { 
    map.setCenter(center); 
    //google.maps.event.trigger(map, 'resize'); 
}); 
function calculateCenter() { 
    var latlngbounds = new google.maps.LatLngBounds(); 

for (var i = 0 ; i < markersArray.length ; i++) { 
    latlngbounds.extend(markersArray[i].getPosition()); 
} 

//map.setCenter(latlngbounds.getCenter(), map.getBoundsZoomLevel(latlngbounds)); 
map.setCenter(latlngbounds.getCenter()); 
map.fitBounds(latlngbounds); 
center = map.getCenter(); 
} 
    function callAfterMarker(){ 
    alert("Market Clicked"); 
} 
function callback(results, status) 
{ 
    var listing='<table width="100%" border="0">'; 
    var num=5; 
    markersArray = new Array(); 
    if (status == google.maps.places.PlacesServiceStatus.OK) 
    { 
     for (var i = 0; i < results.length; i++) 
     { 
     var pincode=''; 
     var address=''; 
     geocoder = new google.maps.Geocoder(); 
     geocoder.geocode({ 
      'address': results[i].vicinity, 
      'partialmatch': true},function(resultsp, status) 
      { 
      if (status == 'OK' && resultsp.length > 0) 
      { 
       address=resultsp[0].formatted_address; 
       var len=resultsp[0].address_components.length-1; 
       var res=resultsp[0].address_components[len].short_name; 
       if(res!=undefined) 
       { 
        //address+="<br>Pincode:"+res.toString(); 
       } 
       //listing+='<tr><td>Zip Code: '+res.toString()+'</td></tr>'; 
      } 
     }); 

     marker = new google.maps.Marker({ 
      position: results[i].geometry.location, 
      title: results[i].name, 
      zIndex: 2, 
      icon: gicons["blue"] 
     }); 
     infowindow = new google.maps.InfoWindow(); 
     google.maps.event.addListener(marker, 'click', (function (marker, i) { 
      return function() { 
       var contentString = '<div id="infowindow' + i + '"><table width="100%"><tr><td>'+results[i].name+'</td></tr><tr><td style="word-wrap: break-word;">'+getaddress(results[i].vicinity)+'</td></tr><?php if(trim($finalURL)){ echo "<tr><td align=\"center\"><a target=\"_blank\" class=\"sty-action-buttn\" href=\"".$finalURL."\">".trim(getFieldFromDB('user_config','BubbleText'))."</a></td></tr>"; }else if(trim(getFieldFromDB('user_config','ActionLink'))){ echo "<tr><td align=\"center\"><a target=\"_blank\" class=\"sty-action-buttn\" href=\"".trim(getFieldFromDB('user_config','ActionLink'))."\">".trim(getFieldFromDB('user_config','BubbleText'))."</a></td></tr>"; }?></table></div>'; 
       infowindow.setContent(contentString); 
       infowindow.open(map, marker); 
      } 
     })(marker, i)); 

     google.maps.event.addListener(marker, 'mouseover', (function (marker, i) { 
      return function() { 
      var contentString = '<div id="infowindow' + i + '"><table width="100%"><tr><td>'+results[i].name+'</td></tr><tr><td style="word-wrap: break-word;">'+getaddress(results[i].vicinity)+'</td></tr><?php if(trim($finalURL)){ echo "<tr><td align=\"center\"><a target=\"_blank\" class=\"sty-action-buttn\" href=\"".$finalURL."\">".trim(getFieldFromDB('user_config','BubbleText'))."</a></td></tr>"; }else if(trim(getFieldFromDB('user_config','ActionLink'))){ echo "<tr><td align=\"center\"><a target=\"_blank\" class=\"sty-action-buttn\" href=\"".trim(getFieldFromDB('user_config','ActionLink'))."\">".trim(getFieldFromDB('user_config','BubbleText'))."</a></td></tr>"; }?></table></div>'; 
      var listItem = document.getElementById("item-" + i); 
      listItem.className = "grey"; 
       infowindow.setContent(contentString); 
       infowindow.open(map, marker); 

      } 

     })(marker, i)); 

       google.maps.event.addListener(marker, 'mouseout', (function (marker, i) { 
      return function() { 

     /*var contentString = '<div id="infowindow' + i + '"><table width="100%"><tr><td>'+results[i].name+'</td></tr><tr><td style="word-wrap: break-word;">'+getaddress(results[i].vicinity)+'</td></tr><?php if(trim($finalURL)){ echo "<tr><td align=\"center\"><a target=\"_blank\" class=\"sty-action-buttn\" href=\"".$finalURL."\">".trim(getFieldFromDB('user_config','BubbleText'))."</a></td></tr>"; }else if(trim(getFieldFromDB('user_config','ActionLink'))){ echo "<tr><td align=\"center\"><a target=\"_blank\" class=\"sty-action-buttn\" href=\"".trim(getFieldFromDB('user_config','ActionLink'))."\">".trim(getFieldFromDB('user_config','BubbleText'))."</a></td></tr>"; }?></table></div>';*/ 
      var listItem = document.getElementById("item-" + i); 
      listItem.className = "change"; 
      marker.setIcon(gicons["blue"]); 
      /* infowindow.setContent(contentString); 
       infowindow.open(map, marker);*/ 

      } 

     })(marker, i)); 

     markersArray.push(marker); 
     calculateCenter(); 
     listing+='<tr><td>'; 

     var address_link=results[i].vicinity.replace(" ","+"); 
     if(i==0) 
     { 
      listing+='<table id="div5" width="100%" >'; 
     } 
     else if(i%5==0) 
     { 
      num+=5; 
      listing+='<table id="div'+num+'" class="myclass" style="display:none;" width="100%">'; 
     } 
     //'+results[i].name+' 
     listing +='<tr id="searchadd"><td ><input type="hidden" value="'+results[i].name+'" name="end'+i+'" id="end'+i+'"></td></tr><tr><td style="word-wrap: break-word;border-bottom:1px solid #cccccc;" onmouseout="markersArray['+i+'].setIcon(gicons.blue)" onmouseover="markersArray['+i+'].setIcon(gicons.yellow);openInfoWindow('+i+')"  class="" id="item-'+i+'">'+getaddress(results[i].vicinity)+'<div id="spacer" style="width:120px;height:1px;float:left;"></div><a style="width:100px;height: 20px;" class="sty-hyperlink" target="_blank" href="https://maps.google.com/maps?daddr='+address_link+'"><b><?php echo getFieldFromDB('user_config','DirectionText'); ?></b></a><br></td></tr>'; 

     if(i ==(results.length-1)) 
     { 
      listing+='</table>'; 
      listing+='<span id="largerwindowlink"><br><a target="_blank" class="sty-action-buttn" href="http://www.franchiseportals.com/contact.php?id=<?php echo $finalURL; ?>"><?php echo trim(getFieldFromDB('user_config','ActionButtonText')); ?></a></span>'; 
     } 
     else if(i>0 &&(i+1)%5==0) 
     { 
      listing+='<tr><td align="right"><a class="sty-hyperlink" style="width:100px;height: 20px;" href="javascript:void(0);" onclick="javascript:show_hide_table('+num+');" ><b><?php echo getFieldFromDB('user_config','MoreResultText'); ?></b></a></td></tr></table>'; 
     } 
     listing+='</td></tr>'; 
     } 
     showOverlays(5); 
     listing +='</table>'; 
     if(results.length<=0) 
     { 
      listing='<br><br><span style="color:green;">Sorry! No stores found.<br>Please try another franchise name</span><br><br>'; 
     } 
    } 
    else 
    { 
     listing='<br><br><span style="color:green;">Sorry! No stores found.<br>Please try another franchise name</span><br><br>'; 
    } 
    document.getElementById("listingAddress").innerHTML=listing; 
} 
function showOverlays(no) 
{ 
    if (markersArray) 
    { 
     for (i in markersArray) 
     { 
      if(i<no && i>=no-5) 
       markersArray[i].setMap(map); 
     } 
    } 
} 
function clearOverlays() 
{ 
    if (markersArray) 
    { 
     for (i in markersArray) 
     { 
       markersArray[i].setMap(null); 
     } 
    } 
} 
function openInfoWindow(loopID) 
{ 
    google.maps.event.trigger(markersArray[(parseInt(loopID))], "click"); 
}  
function show_hide_table(tablid) 
{ 
    var showid=tablid+5; 
    clearOverlays(); 
    showOverlays(showid); 
    if(document.getElementById("div"+showid)) 
    { 
     document.getElementById("div"+showid).style.display="block"; 
    } 
    if(document.getElementById("div"+tablid)) 
    { 
     document.getElementById("div"+tablid).style.display="none"; 
    } 
} 
function checkPin() 
{ 
    if(document.getElementById("pincode").value=="" || trim(document.getElementById("pincode").value)=="") 
    { 
    alert("Please fill the Zip Code"); 
    document.getElementById("pincode").focus(); 
    return false; 
    } 
} 
function checkMobPin() 
{ 
    if(document.getElementById("zipcode").value=="" || trim(document.getElementById("zipcode").value)=="Choose other zip code") 
    { 
     alert("Please fill the Zip Code"); 
     document.getElementById("zipcode").focus(); 
     return false; 
    } 
    else 
    { 
     document.getElementById("pincode").value=document.getElementById("zipcode").value; 
    } 
} 
function show_table() 
{ 
    if (document.getElementById("viewOption").value == "list") 
    { 
     document.getElementById("maptd").className = "list-map-td-change"; 
     document.getElementById("addresstd").className="list-address-td-change"; 
    } 
    else 
    { 
     document.getElementById("maptd").className="list-map-td"; 
     document.getElementById("addresstd").className="list-address-td"; 
    } 
} 
function getaddress(address) 
{ 
    var part=address.split(','); 
    var result=''; 
    for(var i=0; i<part.length; i++) 
    { 
     result+=part[i]+'<br>' ; 
    } 
    return result; 
} 
//alert($(window).width()); 
/*$(window).resize(function() { 
    if($(window).width()<=600) 
     map.setZoom(10); 
    if($(window).width()>600) 
     map.setZoom(11); 
     google.maps.event.trigger(map, 'resize'); 
});*/ 

</script> 
<script> 
$(function() { 
    function log(message) { 
     $("<div/>").text(message).prependTo("#log"); 
     $("#log").attr("scrollTop", 0); 
    } 
     $("#address").autocomplete({    //here you have to write the name of search box, no need to call function from textbox 
      source: "jquery4dd/search_content.php", 
      minLength: 1, 
      selectFirst:true, 
      select: function(event, ui) { 
        $('#business_url').val(ui.item.url); 
        $('#address').val(ui.item.value); 
       } 
     }); 

}); 
function checkAddress() 
{ 
    if(document.getElementById("address").value=="" || trim(document.getElementById("address").value)=="Type Name Here") 
    { 
    alert("Please fill the Business Name"); 
    document.getElementById("address").focus(); 
    return false; 
    } 
}

编辑：您可以检查导致这里My site搜索麦当劳。您还可以检查传递给URL的查询参数。

来源

2012-09-08 Amna Ahmed

其实你只有1个infoWindow对象的所有标记，每个标记需要1个。用以下替换callback - 函数的鼠标悬停和点击部分：

window.zIndex= window.zIndex||100; 
google.maps.event.addListener(marker, 'mouseover', (function (marker, i,infowindow) { 
    return function() { 
     var contentString = '<div id="infowindow' + i + '"><table width="100%"><tr><td>'+results[i].name+'</td></tr><tr><td style="word-wrap: break-word;">'+getaddress(results[i].vicinity)+'</td></tr><tr><td align="center"><a target="_blank" class="sty-action-buttn" href=" http://www.franchiseopportunities.com/franchisefbo.asp?fboid=">Get More Information</a></td></tr></table></div>'; 
     infowindow.setContent(contentString); 
      //brings the infoWindow into front 
     infowindow.setZIndex(window.zIndex++); 
     infowindow.open(map, marker); 
    } 
})(marker, i, new google.maps.InfoWindow()));

它可能会有争议：d，但麦当劳是不是一家商店一家餐厅，你应该将类型更改为“餐厅”

来源

2012-09-08 14:40:29

但我需要取决于什么是在搜索框中输入各种业务搜索，感谢的建议虽然:) –

您可以使用多种类型的存在，如'[ “商店”， “餐厅”]' –

谷歌地图API，将搜索和标记Infowidget

回答

相关问题