2013-04-30 57 views
0

标记附近的配合映射我使用gmap3插件显示结果在谷歌地图 有文本框字段,当有人类型例如在纽约镇“纽约”许多标记,我想要地图缩放并适合纽约,并在这个地方显示所有的标记? 如何做到这一点? 为展示你的,我想看看这个网站的内容:padmapper.com搜索与标记和缩放,与gmap3

,这是我的代码:

$(function(){ 
      $("#main-map").gmap3({ 
     map:{ 
     options:{ 
      center:["newyork"] 
     } 
     }, 
     marker:{ 
     values:[ 
      {latLng:[48.8620722, 2.352047]}, 
      {address:"86000 Poitiers, France"}, 
      {address:"66000 Perpignan, France"} 
     ], 
     } 
    }); 
    $('#ok').click(function(){ 
     var addr = $('#Address').val(); 
     if (!addr || !addr.length) return; 
     $("#main-map").gmap3({ 
     getlatlng:{ 
      address: addr, 
      callback: function(results){ 
      if (!results) return; 
      $(this).gmap3({ 
       marker:{        
       latLng:results[0].geometry.location, 
       map:{ 
        options:{ 
        center: addr , 
        zoom: 12 
        }, 
        center: addr 
       } 
       } 
      }); 
      } 
     } 
     }); 
    }); 

    $('#Address').keypress(function(e){ 
     if (e.keyCode == 13){ 
     $('#ok').click(); 
     } 
    }); 
    }); 

和HTML代码

<div id="main-map"> 
     </div> 
    <input type="text" placeholder="City, Address, or Zip" name="goToAddress" style="margin-left:5px; width:215px;" id="Address"> 
<button id="ok" type="button">Go</button> 

回答

3

试试这个

$('#ok').click(function(){ 
    var addr = $('#Address').val(); 
    if (!addr || !addr.length) return; 
    $("#main-map").gmap3({ 
    getlatlng:{ 
     address: addr, 
     callback: function(results){ 
     if (!results) return; 
     $(this).gmap3({ 
      marker:{        
      latLng:results[0].geometry.location, 

      } 
      {action: 'setCenter', args:[ result[0].geometry.location ]} 
     }); 
     } 
    } 
    }); 
});