Reset Bounds on Google Map v3 API

匿名 (未验证) 提交于 2019-12-03 00:44:02

问题:

This is most definitely the same question as Reset bounds on Google Maps API v3 which has no answer.

I want to give a user the opportunity to change the area in which they search. I place markers of locations within the zip code (and "touching" zips). If they want to search a different zip they can enter a new zip code and we repeat the process.

I follow the google-suggested way of removing markers and such, but have not yet figured out how to clear the map bounds and start all over with a new set of bounds. Below is the function that is called with each new zip code entry.

    MYMAP.placeMarkers = function(zipcode) {             if(markers.length > 0) {                 for(var i=0;i<markers.length;i++) {                     markers[i].setMap(null);                 }                                    markers = new Array();                 var bounds = new google.maps.LatLngBounds();                 MYMAP.map.fitBounds(bounds);                                   }            $.post("/locations",{"zip": zipcode}, function (data) {               data = JSON.parse(data);               $.each(data, function (key, value) {                 var name = value.name;                 var address = value.address;                 // create a new LatLng point for the marker                 var lat = value.lat;                 var lng = value.lon;                 var point = new google.maps.LatLng(parseFloat(lat),parseFloat(lng));                 // extend the bounds to include the new point                 MYMAP.bounds.extend(point);                 // add the marker itself                 var marker = new google.maps.Marker({                     position: point,                     map: MYMAP.map                 });                 // create the tooltip and its text                 infoBubble = new InfoBubble({                   shadowStyle: 1,                   padding: 10,                         backgroundColor: 'white',                   borderRadius: 5,                   arrowSize: 10,                   borderWidth: 1,                   maxWidth: 400,                   borderColor: '#A85E45',                   disableAutoPan: false,                   hideCloseButton: true,                   arrowPosition: 50,                   backgroundClassName: 'phoney',                   disableAutoPan: true,                   hideCloseButton: false,                   arrowStyle: 0                 });                  var html='<b>'+name+'</b><br />'+address;                 // add a listener to open the tooltip when a user clicks on one of the markers                 google.maps.event.addListener(marker, 'click', function() {                     infoBubble.setContent(html);                     infoBubble.open(MYMAP.map, marker);                 });                 markers.push(marker);               });                 // Fit the map around the markers we added:               MYMAP.map.fitBounds(MYMAP.bounds);               google.maps.event.trigger(map, "resize");           });         } 
标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!