Error: InvalidValueError: setCenter: not LatLng or LatLngLiteral: in properties lat: not a number
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'
});}
it throws the following error:
error: InvalidValueError: setCenter: not LatLng or LatLngLiteral: in property lat: not a number
+3
source to share
2 answers
The attribute .value
HTMLInputElement
returns a value as a string.
You need to parse the content lat
and lng
using parseFloat()
before passing it to the Maps 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'
});
}
+13
source to share
Just add "+" in front of your variables:
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'
});}
0
source to share