谷歌地图a.lat不是一个函数。 [英] Google maps a.lat is not a function.

问题描述

这是我第一次使用javascript google maps API，当我尝试 LatLngBounds.extend（）
<$时，我一直收到这个错误c $ c> Uncaught TypeError：a.lat不是函数

我已经能够获取并平均所有坐标并移动相机到那个位置，但我想能够动态调整缩放以适应一切。当我在for循环中注释掉 bounds.extend（myLatLng）行时，我不会收到错误。

  map = new google.maps.Map（document.getElementById（'map'），{
 center：{lat：-34.397，lng：150.644}，
 zoom：8 
}）; 
 
 var avLat = 0; 
 var avLon = 0; 
 var pathCoords = []; 
 
 var bounds = new google.maps.LatLngBounds（）; （var i = 0，len = data.length; i< len; i ++）{
 var myLatLng = {lat：parseFloat（data [i] .Lat），lng的
 
 ：parseFloat（data [i] .Lon）}; 
 pathCoords.push（myLatLng）; 
 bounds.extend（myLatLng）; 
 avLat + = parseFloat（data [i] .Lat）; 
 avLon + = parseFloat（data [i] .Lon）; 
 
 
 var path = new google.maps.Polyline（{
 path：pathCoords，
 geodesic：true，
 strokeColor：'＃0000FF' ，
 strokeOpacity：1.0，
 strokeWeight：2 
}）; 
 
 path.setMap（map）; 
 avLat = avLat / data.length; 
 avLon = avLon / data.length; 
 
 map.fitBounds（bounds）; 
 // map.setCenter（{lat：avLat，lng：avLon}）; 
 // map.setZoom（12）; 
 
 
  

解决方案

不要使用 google.maps.LatLngLiteral 的 google.maps。 LatLngBounds.extend 方法，您必须将其转换为

>代码段：
$ b

  html，body，＃map {height：100％;宽度：100％; margin：0px; < script src =https：//   

This is my first time working with the javascript google maps api and I keep getting an this error when I try to LatLngBounds.extend() Uncaught TypeError: a.lat is not a function

I have been able to get and average of all the coordinates and move the camera to that location but I want to be able to dynamically adjust the zoom to fit everything. I do not get the error when i comment out the line bounds.extend(myLatLng) in the for loop.

  map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: -34.397, lng: 150.644},
    zoom: 8
  });

  var avLat = 0;
  var avLon = 0;
  var pathCoords = [];

  var bounds = new google.maps.LatLngBounds();

  for (var i = 0, len = data.length; i < len; i++) {
    var myLatLng = {lat: parseFloat(data[i].Lat), lng: parseFloat(data[i].Lon)};
    pathCoords.push(myLatLng);
    bounds.extend(myLatLng);
    avLat += parseFloat(data[i].Lat);
    avLon += parseFloat(data[i].Lon);
  }

  var path = new google.maps.Polyline({
    path: pathCoords,
    geodesic: true,
    strokeColor: '#0000FF',
    strokeOpacity: 1.0,
    strokeWeight: 2
  });

  path.setMap(map);
  avLat = avLat/data.length;
  avLon = avLon/data.length;

    map.fitBounds(bounds);
  // map.setCenter({lat: avLat, lng: avLon});
  // map.setZoom(12);

}

解决方案

You can't use a google.maps.LatLngLiteral in the google.maps.LatLngBounds.extend method, you have to convert it into a google.maps.LatLng object (at least for now).

code snippet:

var geocoder;
var map;
var data = [{
  Lat: -34.397,
  Lon: 150.644
}, {
  Lat: -34,
  Lon: 150
}];

function initialize() {
  map = new google.maps.Map(document.getElementById('map'), {
    center: {
      lat: -34.397,
      lng: 150.644
    },
    zoom: 8
  });

  var avLat = 0;
  var avLon = 0;
  var pathCoords = [];

  var bounds = new google.maps.LatLngBounds();

  for (var i = 0, len = data.length; i < len; i++) {
    var myLatLng = new google.maps.LatLng(parseFloat(data[i].Lat), parseFloat(data[i].Lon));
    pathCoords.push(myLatLng);

    bounds.extend(myLatLng);
    avLat += parseFloat(data[i].Lat);
    avLon += parseFloat(data[i].Lon);
  }

  var path = new google.maps.Polyline({
    path: pathCoords,
    geodesic: true,
    strokeColor: '#0000FF',
    strokeOpacity: 1.0,
    strokeWeight: 2
  });

  path.setMap(map);
  avLat = avLat / data.length;
  avLon = avLon / data.length;

  map.fitBounds(bounds);
}
google.maps.event.addDomListener(window, "load", initialize);

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

<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map"></div>

这篇关于谷歌地图a.lat不是一个函数。的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！