2013-04-04 3 views
1

Привет, я хочу реализовать функцию погоды в одном из моих приложений. поэтому для этого мне нужно использовать weather API.so кто-нибудь может предложить мне, какой погодный API, а также учебник, как реализовать это с помощью jquery Mobile.Как реализовать погодный API

+0

См. Http: // stackoverflow.com/questions/3363052/best-weather-apis-free-for-commercial-use – wmfairuz

ответ

5

Здесь немного решений, все зависит от того, насколько вы готовы пойти. Вы хотите сразу показать конечный результат или вы хотите разобрать его самостоятельно?

Комплексные решения

Yahoo! Weather Feed Plugin for jQuery

HTML:

<div data-role="page" id="index"> 
    <div data-theme="a" data-role="header"> 
     <h3> 
      First Page 
     </h3> 
     <a href="#second" class="ui-btn-right">Next</a> 
    </div> 

    <div data-role="content"> 
     <div id="test"></div> 
    </div> 

    <div data-theme="a" data-role="footer" data-position="fixed"> 

    </div> 
</div> 

Javascript:

$(document).on('pagebeforeshow', '#index', function(){  
    $(document).ready(function() { 
     $('#test').weatherfeed(['UKXX0085','EGXX0011','UKXX0061','CAXX0518','CHXX0049']); 
    }); 
}); 

Рабочий пример: http://jsfiddle.net/Gajotres/7qvJH/

Simple weather plugin

Вероятно, одним из лучших, потому что вы получите работоспособный плагин, но вы можете использовать его, чтобы показать данные, как всегда вы хотите, где вы хотите.

Рабочий пример (не мой): http://jsfiddle.net/fleeting/a4hbL/

HTML:

<!-- Docs at http://simpleweather.monkeecreate.com --> 
<div id="weather"></div> 

Javascript:

// Docs at http://simpleweather.monkeecreate.com 
$(document).ready(function() { 
    $.simpleWeather({ 
    zipcode: '', 
    woeid: '2357536', 
    location: '', 
    unit: 'f', 
    success: function(weather) { 
     html = '<h2>'+weather.temp+'&deg;'+weather.units.temp+'</h2>'; 
     html += '<ul><li>'+weather.city+', '+weather.region+'</li>'; 
     html += '<li class="currently">'+weather.currently+'</li>'; 
     html += '<li>'+weather.tempAlt+'&deg;C</li></ul>'; 

     $("#weather").html(html); 
    }, 
    error: function(error) { 
     $("#weather").html('<p>'+error+'</p>'); 
    } 
    }); 
}); 

Учебники

Tutorial 1

Источник: Google подача погоды

Это простой учебник. Там вы найдете все, чтобы сделать это самостоятельно. Просто будьте осторожны, для этого требуются PHP и jQuery.

Tutorial 2

Источник: Yahoo погода корма

Другой большой учебник. Для этого требуется только jQuery. Там вы найдете все, что вам нужно сделать, чтобы оно работало.

Демо:http://demo.tutorialzine.com/2012/05/weather-forecast-geolocation-jquery/

Хотя этот учебник имеют некоторые недостатки (это требует вашего местоположения Geo) он может быть использован, чтобы вручную создать новый погодный плагин.

+0

jsfiddle удаляется! и Yahoo! Плагин Feed Feed для jQuery больше не поддерживается –

Смежные вопросы