jquery - Weather API error {"cod":"400","message":"{vlat} is not a float"} -
i trying api coordinates local weather app project , link open weather map
http://api.openweathermap.org/data/2.5/weather?lat='+lat+'&lon='+long+'&appid=7cc72055cf03c02e9bf988f2a7b7b7e2
i error message every time try open link.
{"cod":"400","message":"{vlat} not float"}
also prevents console pulling location. here link code.
https://codepen.io/andreacarr/pen/eememr?editors=1111
please , let me know seems error
the issue because geolocation.getcurrentposition
call asynchronous, hence you're trying use lat
, long
both before defined , out of scope.
to fix need put $.getjson
call within callback of geolocation logic, this:
$(document).ready(function() { var long; var lat; if (navigator.geolocation) { navigator.geolocation.getcurrentposition(function(position) { long = position.coords.longitude; lat = position.coords.latitude; $("#data").html("latitude: " + lat + "<br>longitude: " + long); var api = 'https://api.openweathermap.org/data/2.5/weather?lat=' + lat + '&lon=' + long + '&appid=7cc72055cf03c02e9bf988f2a7b7b7e2'; $.getjson(api, function(data) { console.log(data.coord.lon); console.log(data); }); }); } });
html { background: url(http://s1.picswalls.com/wallpapers/2016/06/06/beach-desktop-background_090607928_305.jpg)center center fixed; background-size: cover; } header { font-family: lobster; color: white; font-size: 40px; text-align: center; margin: 40px; font-weight: bold; } p { color: white; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <header>local weather</header> <p id="data"></p>
note example has created in jsfiddle geolocation doesn't work in stack snippet.
wiki
Comments
Post a Comment