Google Maps JS Api - b.get不是函数错误(isLocationOnEdge)

时间:2017-12-17 22:41:20

标签: javascript google-maps typeerror

我想检查我的路线上是否有标记..所以我尝试使用isLocationOnEdge()并且我得到" TypeError:b.get不是函数"错误。 这是我的代码,我尝试了几处更改,但无法解决问题。

      var directionsDisplay = new google.maps.DirectionsRenderer;
      var directionsService = new google.maps.DirectionsService;

      directionsDisplay.setMap(map);

      calculateAndDisplayRoute(directionsService, directionsDisplay);

      function calculateAndDisplayRoute(directionsService, directionsDisplay) {
      directionsService.route({
      origin: my_position.getPosition(),
      destination: new google.maps.LatLng(my_markers[0][0],my_markers[0][1]),
      travelMode: 'DRIVING'
    }, function(response, status) {
      if (status === 'OK') {
        directionsDisplay.setDirections(response);
      } else {
        window.alert('Directions request failed due to ' + status);
      }
      var isLocationOnEdge = google.maps.geometry.poly.isLocationOnEdge;
      var path = response.routes[0].overview_path;
      for (var i = 0; i < my_markers.length; i++) {
      if (isLocationOnEdge(new google.maps.LatLng(my_markers[i][0],my_markers[i][1]),path))
          {
              console.log("Its in!")
          }
        }


    });

1 个答案:

答案 0 :(得分:0)

根据the documentation,teh isLocationOnEdge方法采用以下参数:

  

isLocationOnEdge(点:LatLng,poly:Polygon |折线,公差?:数字)
  返回值:布尔值
  计算给定点是否位于指定公差范围内的折线或多边形边缘上或附近。当提供的点的纬度和经度与边缘上的最近点之间的差小于公差时,返回true。公差默认为10-9度。

overview_path不是google.maps.Polyline(或多边形),它是google.maps.LatLng个对象的数组。

如果我使用该路径创建折线,则适用于mel

var isLocationOnEdge = google.maps.geometry.poly.isLocationOnEdge;
var path = response.routes[0].overview_path;
var polyline = new google.maps.Polyline({
  path: path
})
if (isLocationOnEdge(new google.maps.LatLng(37.438442, -122.157558), polyline, 1e-3)) {
  console.log("Its in!")
}

proof of concept fiddle

screenshot of resulting map

代码段

&#13;
&#13;
function initialize() {
  var map = new google.maps.Map(
    document.getElementById("map_canvas"), {
      center: new google.maps.LatLng(37.4419, -122.1419),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP,
      styles: [{
        featureType: 'poi',
        stylers: [{
          visibility: 'off'
        }]
      }]
    });

  var directionsDisplay = new google.maps.DirectionsRenderer;
  var directionsService = new google.maps.DirectionsService;

  directionsDisplay.setMap(map);

  calculateAndDisplayRoute(directionsService, directionsDisplay);

  function calculateAndDisplayRoute(directionsService, directionsDisplay) {
    directionsService.route({
      origin: "Palo Alto, CA",
      destination: "Stanford, CA",
      travelMode: 'DRIVING'
    }, function(response, status) {
      if (status === 'OK') {
        directionsDisplay.setDirections(response);
      } else {
        window.alert('Directions request failed due to ' + status);
      }
      var isLocationOnEdge = google.maps.geometry.poly.isLocationOnEdge;
      var path = response.routes[0].overview_path;
      var polyline = new google.maps.Polyline({
        path: path
      })
      if (isLocationOnEdge(new google.maps.LatLng(37.438442, -122.157558), polyline, 1e-3)) {
        console.log("Its in!")
        var mark = new google.maps.Marker({
          map: map,
          position: new google.maps.LatLng(37.438442, -122.157558),
          icon: {
            url: "https://maps.gstatic.com/intl/en_us/mapfiles/markers2/measle.png",
            size: new google.maps.Size(7, 7),
            anchor: new google.maps.Point(3.5, 3.5)
          },
          title: "On Route"
        });
        var infowindow = new google.maps.InfoWindow({
          content: "on route"
        });
        infowindow.open(map, mark);
      }
    });
  }
}
google.maps.event.addDomListener(window, "load", initialize);
&#13;
html,
body,
#map_canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}
&#13;
<script src="https://maps.googleapis.com/maps/api/js?libraries=geometry"></script>
<div id="map_canvas"></div>
&#13;
&#13;
&#13;