Google Map错误-a.lng不是函数

Suresh 发表于 Dev

苏雷什

我打算在我的一个应用程序中使用google map“ containsLocation（）” API。doc链接为-https: //goo.gl/4BFHCz

我正在遵循相同的示例。这是我的代码。

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <title>Polygon arrays</title>
    <style>
      html, body {
        height: 100%;
        margin: 0;
        padding: 0;
      }
      #map {
        height: 100%;
      }
    </style>
  </head>
  <body>
    <div id="map"></div>
    <script>
      // This example requires the Geometry library. Include the libraries=geometry
      // parameter when you first load the API. For example:
      // <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&libraries=geometry">

      function initMap() {
        var map = new google.maps.Map(document.getElementById('map'), {
          //center: {lat: 24.886, lng: -70.269},
          center: {lat: 12.9629277, lng: 77.7178972},
          zoom: 30,
        });

        /*var triangleCoords = [
          {lat: 25.774, lng: -80.19},
          {lat: 18.466, lng: -66.118},
          {lat: 32.321, lng: -64.757}
        ];*/

        var triangleCoords = [
          {lat: 12.96301273, lng: 77.71785952},
          {lat: 12.96314857, lng: 77.71784072},
          {lat: 12.96316124, lng: 77.71784037},
          {lat: 12.96295465, lng: 77.71788993},
          {lat: 12.96293329, lng: 77.7179345},
        ];

        var bermudaTriangle = new google.maps.Polygon({paths: triangleCoords});

        google.maps.event.addListener(map, 'click', function(e) {

          var curPosition = {"lat":12.9629277,"lng":77.7178972};
          //var curPosition = e.latLng;

          console.log("e content : "+JSON.stringify(e.latLng));
          console.log("curPosition content : "+JSON.stringify(curPosition));

          var resultColor =
              google.maps.geometry.poly.containsLocation(curPosition, bermudaTriangle) ?
              'red' :
              'green';

          new google.maps.Marker({
            position: curPosition,
            map: map,
            icon: {
              path: google.maps.SymbolPath.CIRCLE,
              fillColor: resultColor,
              fillOpacity: .2,
              strokeColor: 'white',
              strokeWeight: .5,
              scale: 10
            }
          });


        });
      }
    </script>
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCiAur6ANJsV776iVmMDJcHYjQkXrXyu8s&libraries=geometry&callback=initMap"
         async defer></script>
  </body>
</html>

如果看到的话，我创建了一个curPosition包含latLng数据的变量。我在这里的问题是只要var curPosition = e.latLng;它能正常工作，但是当我将其更改为var curPosition = {"lat":12.9629277,"lng":77.7178972};它的那一刻开始显示错误"Uncaught TypeError: a.lng is not a function"。

无法理解为什么会这样吗？有任何线索...吗？

Console.log屏幕快照已附加

问候

地理编码

该containsLocation方法需要google.maps.LatLng作为“点”（至少目前是这样），您不能将google.maps.LatLngLiteral用于currentLocation。

从文档中：

containsLocation（point：LatLng，多边形：Polygon）| 返回值：布尔值

计算给定点是否位于指定的多边形内。

 var curPosition = new google.maps.LatLng(12.9629277,77.7178972);

代码段：

function initMap() {
  var map = new google.maps.Map(document.getElementById('map'), {
    center: {
      lat: 12.9629277,
      lng: 77.7178972
    },
    zoom: 30,
  });

  var triangleCoords = [
     {lat: 12.96301273,lng: 77.71785952}, {lat: 12.96314857, lng: 77.71784072}, {lat: 12.96316124, lng: 77.71784037}, {lat: 12.96293329, lng: 77.7179345}, {lat: 12.96295465, lng: 77.71788993}];
  var bermudaTriangle = new google.maps.Polygon({
    paths: triangleCoords,
    map: map
  });

  var curPosition = new google.maps.LatLng(12.9629277, 77.7178972);
  console.log("curPosition content : " + JSON.stringify(curPosition));

  var resultColor =
    google.maps.geometry.poly.containsLocation(curPosition, bermudaTriangle) ?
    'red' :
    'green';

  new google.maps.Marker({
    position: curPosition,
    map: map,
    icon: {
      path: google.maps.SymbolPath.CIRCLE,
      fillColor: resultColor,
      fillOpacity: .2,
      strokeColor: 'white',
      strokeWeight: .5,
      scale: 10
    }
  });
  var curPositionB = new google.maps.LatLng(12.963, 77.71788993);
  var resultColorB = google.maps.geometry.poly.containsLocation(curPositionB, bermudaTriangle) ?
    'red' :
    'green';

  new google.maps.Marker({
    position: curPositionB,
    map: map,
    icon: {
      path: google.maps.SymbolPath.CIRCLE,
      fillColor: resultColorB,
      fillOpacity: .2,
      strokeColor: 'white',
      strokeWeight: .5,
      scale: 10
    }
  });
}
google.maps.event.addDomListener(window, 'load', initMap);

html,
body {
  height: 100%;
  margin: 0;
  padding: 0;
}
#map {
  height: 100%;
}

<script src="https://maps.googleapis.com/maps/api/js?libraries=geometry&key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk"></script>
<div id="map"></div>

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。

编辑于2021-02-25

我来说两句

0条评论

登录后参与评论

上一篇：编译后Visual Studio冻结。当我尝试启动应用程序时，资源管理器也是如此

来自分类Dev

Google Map上的突然错误：TypeError：_.x不是函数

来自分类Dev

错误：.map（）不是函数

来自分类Dev

Google Map API TypeError：this [Dc]不是函数

来自分类Dev

Google图表错误：bL不是函数

来自分类Dev

未定义 Google Map API 无效值错误函数？

来自分类Dev

Google Map Center（Lat / Lng）问题

来自分类Dev

Google Map API错误

来自分类Dev

Google Map错误：InvalidKeyOrUnauthorizedURLMapError

来自分类Dev

Google Map Geolocation错误

来自分类Dev

Google Map v3-getPosition不是函数

来自分类Dev

错误：setBackgroundColorTransparent（）不是Google Apps脚本中的函数

来自分类Dev

未捕获的TypeError：r不是函数-Google登录错误-反应

来自分类Dev

类型错误：google.maps.Markers 不是构造函数

来自分类Dev

'this.props.tasks.map 不是函数'错误-反应错误

来自分类Dev

未显示 Google 图表仪表，类型错误：google.visualization.Gauge 不是构造函数

来自分类Dev

Google模拟编译错误（错误：“ <函数名称>”不是类型）

来自分类Dev

收到错误this.state.datas.map不是函数

来自分类Dev

获取错误为“ TypeError：results.map不是函数”

来自分类Dev

获取错误 - TypeError：this.props.registerMessage.map 不是函数

来自分类Dev

类型错误：this.http.get(...).map 不是函数

来自分类Dev

类型错误：this.state.user.map 不是反应中的函数

来自分类Dev

类型错误：this.state.article.map 不是函数 REACT

来自分类Dev

类型错误：this.state.patients.map 不是函数

来自分类Dev

类型错误：this.state.champions.map 不是函数

来自分类Dev

类型错误：this.state.userInfo.map 不是函数

来自分类Dev

反应类型错误：this.state.entries.map 不是函数

来自分类Dev

Angular Kendo-dropdownlist 错误 data.map 不是函数

来自分类Dev

类型错误：this.state.merchentOrders.map 不是函数

来自分类Dev

angular-google-maps TypeError：$ scope.map.control.refresh不是函数

Related 相关文章

文章