Question

我按照Google地图商店定位器教程https://developers.google.com/maps/articles/phpsqlsearch_v3制作了一个定位器，该定位器获取用户的位置和半径，然后输出用户所在位置半径内的所有商店位置。在大多数情况下，它有效！

我的问题是，当我输入一个位置和半径并且该半径内没有商店时，我的定位器将地图居中到太平洋中部。

我尽力研究其他商店定位器问题，但他们都是关于让定位器本身工作。如果我错过了什么，我道歉！此外，当谈到javascript时，我是初学者，所以对代码背后的逻辑的答案表示赞赏！

谢谢！

function searchLocationsNear(center) {
 clearLocations();

 var radius = document.getElementById('radiusSelect').value;
 var searchUrl = 'storelocator_getXML.php?lat=' + center.lat() + '&lng=' + center.lng() + '&radius=' + radius;
 downloadUrl(searchUrl, function(data) {
   var xml = parseXml(data);
   var markerNodes = xml.documentElement.getElementsByTagName("marker");
   var bounds = new google.maps.LatLngBounds();
   for (var i = 0; i < markerNodes.length; i++) {
     var name = markerNodes[i].getAttribute("name");
     var address = markerNodes[i].getAttribute("address");
     var phone = markerNodes[i].getAttribute("phone");
     var fax = markerNodes[i].getAttribute("fax");
     var directions = markerNodes[i].getAttribute("directions");
     var distance = parseFloat(markerNodes[i].getAttribute("distance"));
     var latlng = new google.maps.LatLng(
      parseFloat(markerNodes[i].getAttribute("lat")),
      parseFloat(markerNodes[i].getAttribute("lng")));

     createOption(name, address, distance, i);
     createMarker(latlng, name, address, phone, fax, directions);
     bounds.extend(latlng);
   }
   map.fitBounds(bounds);
   locationSelect.style.visibility = "visible";
   locationSelect.onchange = function() {
     var markerNum = locationSelect.options[locationSelect.selectedIndex].value;
     google.maps.event.trigger(markers[markerNum], 'click');
   };
  });
}

Answer 1

经过大量的反复试验，我有一个aha时刻，我发现在哪里放置if / else语句以保持我的地图远离太平洋：

function searchLocationsNear(center) {
 clearLocations();

 var radius = document.getElementById('radiusSelect').value;
 var searchUrl = 'storelocator_getXML.php?lat=' + center.lat() + '&lng=' + center.lng() + '&radius=' + radius;
 downloadUrl(searchUrl, function(data) {
   var xml = parseXml(data);
   var markerNodes = xml.documentElement.getElementsByTagName("marker");

我在这里放了一个if语句。在抓住所选半径内的所有标记位置之后，如果有标记继续正常，则表示正确：

   if(markerNodes.length>0){

   var bounds = new google.maps.LatLngBounds();
   for (var i = 0; i < markerNodes.length; i++) {
     var name = markerNodes[i].getAttribute("name");
     var address = markerNodes[i].getAttribute("address");
 var phone = markerNodes[i].getAttribute("phone");
 var fax = markerNodes[i].getAttribute("fax");
 var directions = markerNodes[i].getAttribute("directions");
     var distance = parseFloat(markerNodes[i].getAttribute("distance"));
     var latlng = new google.maps.LatLng(
          parseFloat(markerNodes[i].getAttribute("lat")),
          parseFloat(markerNodes[i].getAttribute("lng")));

     createOption(name, address, distance, i);
     createMarker(latlng, name, address, phone, fax, directions);
     bounds.extend(latlng);
    }
    map.fitBounds(bounds);

在这里，我把其他人放在半径范围内没有标记的情况下做什么：

  } else {
    alert('Sorry, there are no stores that close to your location. Try expanding your search radius.');
   }

   locationSelect.style.visibility = "visible";
   locationSelect.onchange = function() {
     var markerNum = locationSelect.options[locationSelect.selectedIndex].value;
     google.maps.event.trigger(markers[markerNum], 'click');
   };

 });
}

具有Radius的Google Maps API v3商店定位器：当用户半径中没有商店时控制地图输出

1 个答案: