A API accuweather
A API da accuweather oferece uma forma simples de colocar dados da condição climática e temperatura da sua cidade em seu site. A API utiliza de uma estrutura jSON.
Para ter acesso aos dados jSon da cidade de Atibaia por exemplo, acesse o endereço;
http://apidev.accuweather.com/currentconditions/v1/36728.json?language=pt&apikey=hoArfRosT1215
Você verá estas informações;
Como obter dados de outras cidades?
Note que a url, é o nome do arquivo .json que define a cidade. Neste exemplo, o arquivo 36728.json se refere apenas a cidade de Atibaia. Se quisermos encontrar os dados da cidade de Santa Cruz do Rio Pardo, teriámos que descobrir o código no site da accuweather.
Acesse o site accuweather.com e procure pela cidade desejada, você obeterá o código na url, veja;
Abora basta trocar o código na url.
Script para leitura dos dados do Tempo
No artigo anterior, ensinei como Como ler uma estrutura jSON com JQuery de forma fácil. Vou utilizar desta mesma aula para escrever o script que fará a leitura dos dados. A única diferença é que neste caso não precisamos criar um laço de repetição pois todos os valores da accuweather já são exibidos em uma única linha. O código completo, usando jQuery ficaria assim;
<script
src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
<img src='' id="icone" width="60px">
<br/>
<strong>ATIBAIA</strong><br/>
<span id="temperatura"></span><br/>
<span id="clima"></span>
<script>
$(document).ready(function(){
$.get( "http://apidev.accuweather.com/currentconditions/v1/36728.json?language=pt&apikey=hoArfRosT1215", function(data) {
$('#temperatura').html(data[0].Temperature.Metric.Value);
$('#clima').html(data[0].WeatherText);
$('#icone').attr('src','https://vortex.accuweather.com/adc2010/images/slate/icons/' + data[0].WeatherIcon + '.svg');
});
});
</script>
O resultado será:
Veja o resultado em: http://aulas-profanderson.azurewebsites.net/tpi/tempo
Importante: Esta aula mostra a forma mais simples de obter os dados. Caso queira obter mais informações, como a previsão do tempo por exemplo, é necessário criar uma chave de acesso à API e ler a documentação da AccuWeather
