Question

function initAutocomplete() {
    var lat=document.getElementById('lat').value;
    var lng=document.getElementById('lng').value;
    console.log(lat);
    console.log(lng);


    var map = new google.maps.Map(document.getElementById('map'), {
      center: {lat:lat, lng:lng},
      zoom: 13,
      mapTypeId: 'roadmap'
    });}

它给了我以下错误：

错误：InvalidValueError：setCenter：不是LatLng或LatLngLiteral：in property lat：不是数字

Answer 1

HTMLInputElement的.value属性将值作为字符串返回。

您必须先将lat和lng的内容与parseFloat()一起解析，然后再将其传递给地图API

function initAutocomplete() {
    var lat = parseFloat(document.getElementById('lat').value);
    var lng = parseFloat(document.getElementById('lng').value);

    var map = new google.maps.Map(document.getElementById('map'), {
        center: {
            lat: lat,
            lng: lng
        },
        zoom: 13,
        mapTypeId: 'roadmap'
    });
}

Answer 2

只需在变量前添加“+”：

function initAutocomplete() {
var lat=document.getElementById('lat').value;
var lng=document.getElementById('lng').value;

var map = new google.maps.Map(document.getElementById('map'), {
  center: {lat: +lat, lng: +lng},
  zoom: 13,
  mapTypeId: 'roadmap'
});}

Answer 3

我在使用自动完成功能时也遇到了这个错误，上面的建议没有解决。就我而言，我能够通过将 lat 和 lng 作为属性传递给我的 Gmaps 元素来纠正此问题：

<Gmaps width={width}
       height={height}
       lat={lat}
       lng={lng}
       params = {{
           v: '3.exp',
           libraries: 'geometry, visualization, places', 
           key: GOOGLE_MAPS_API_KEY
       }}
       onMapCreated={this.onMapCreated}/>

这是使用 react-gmaps 1.4.2 版。

Answer 4

只需初始化参数：

function initMap(lat_ = 0, lon_ = 0) {
    var map = new google.maps.Map(document.getElementById('map'), {
        center: {lat: lat_, lng: lon_},
        zoom: 10
    });
}

Answer 5

相同错误，但情况略有不同：

当尝试使用自动完成的经/纬度来更新地图时，我不断收到此错误（与OP相同）：

    var place = autocomplete.getPlace();
    var geo = place.geometry.location;
    loadMapAt(new google.maps.LatLng(geo.lat, geo.lng));

这个“怪异的把戏”解决了它。将第二行替换为：

    var geo = JSON.parse(JSON.stringify(place.geometry.location));

错误：InvalidValueError：setCenter：不是LatLng或LatLngLiteral：在属性lat中：不是数字

5 个答案: