javascript - Google maps API showing blank map when given LatLng cords from HTML5 Geolocation -
i'm trying use html5's geolocation features. have function coordinates , use coordinates in call google maps api. if manually specify latitude , longitude works great, reason doesn't work way, empty map, controls there, no actual map. believe code correct, maybe overlooked something.
here's code:
var x = document.getelementbyid("msg"); function getlocation() { if (navigator.geolocation) { navigator.geolocation.getcurrentposition(showposition, showerror); } else { x.innerhtml = "geolocation not supported browser."; } } function showposition(position) { var mapoptions = { center: new google.maps.latlng(position.coords.latitude + ", " + position.coords.longitude), zoom: 5, maptypeid: google.maps.maptypeid.roadmap }; var map = new google.maps.map(document.getelementbyid("map"), mapoptions); var acoptions = { types: ['establishment'] }; var autocomplete = new google.maps.places.autocomplete(document.getelementbyid('autocomplete'), acoptions); autocomplete.bindto('bounds', map); var infowindow = new google.maps.infowindow(); var marker = new google.maps.marker({ map: map }); google.maps.event.addlistener(autocomplete, 'place_changed', function () { infowindow.close(); var place = autocomplete.getplace(); if (place.geometry.viewport) { map.fitbounds(place.geometry.viewport); } else { map.setcenter(place.geometry.location); map.setzoom(17); } marker.setposition(place.geometry.location); infowindow.setcontent('<div><strong>' + place.name + '</strong><br />'); infowindow.open(map, marker); google.maps.event.addlistener(marker, 'click', function (e) { infowindow.open(map, marker); }); }); var x = document.getelementbyid("msg"); x.innerhtml = position.coords.latitude + ", " + position.coords.longitude; } function showerror(error) { switch (error.code) { case error.permission_denied: x.innerhtml = "user denied request geolocation." break; case error.position_unavailable: x.innerhtml = "location information unavailable." break; case error.timeout: x.innerhtml = "the request user location timed out." break; case error.unknown_error: x.innerhtml = "an unknown error occurred." break; } } google.maps.event.adddomlistener(window, 'load', getlocation);
the latlng constructor takes 2 arguments(and optional third) both numeric 1 latitude , other longitude, not both concatenated string .
center: new google.maps.latlng(position.coords.latitude, position.coords.longitude),
Comments
Post a Comment