FORECAST.IO jquery天气变化

时间:2016-05-12 20:02:05

标签: jquery

我的jquery天气需要帮助。我正在使用jquery天气预报。他和他完成并没有问题,但问题是我使用地理位置检测。我希望他进行自动完成搜索,使用谷歌服务,但我不知道如何。

这是我的代码,如果有人能够帮助我请。

$(function(){
  document.addEventListener("deviceready", onDeviceReady, false);
})

function onDeviceReady() {
  navigator.geolocation.getCurrentPosition(onSuccess, onError);     
}

function onSuccess(position) {
        var element = document.getElementById('geolocation');
    element.innerHTML = 'Latitude: '  + position.coords.latitude      + '<br />' +
                        'Longitude: ' + position.coords.longitude     + '<br />' +
                        '<hr />'      + element.innerHTML;
  // your callback here 
}

function onError(error) { 
  // your callback here
}
    $(window).load(function () {

        $("#divloader").fadeOut("slow");

    })
 function checkCondition(data) {
        if (data.minutely) {
            CurrCond = data.minutely.summary;
        }else {
            CurrCond = data.currently.summary;
        }
    };

 var x = document.getElementById("demo");

 if (navigator.geolocation) {
 navigator.geolocation.getCurrentPosition(showPosition);
 } else { 
 x.innerHTML = "Geolocation is not supported by this browser.";
 }

 function showPosition(position) {
 var location = position.coords.latitude + "," + position.coords.longitude; 

 jQuery(document).ready(function(weather) {

 $.ajax({
 url : "https://api.forecast.io/forecast/3a6d5408bc15a469385cf59ee96c0205/"+position.coords.latitude +","+position.coords.longitude+"?lang=ar&units=si",
 dataType : "jsonp",

 success : function(data) {


 var html = '';

html +=  '<div id="back" style="background-image: url(img/'+data.currently.icon+'.jpg);background-repeat:no-repeat;background-size: cover;color: floralwhite;border-radius: 6px;"> ';

html +='<table style="width: 100%"><tr><td class="auto-style2" dir="ltr">الان</td><td class="auto-style1" dir="rtl"><span class="label label-primary">'+ Math.round(data.currently.temperature) + 'C</span></td></tr></table>';

html += '<img class="center-block" style="right: 15px;position: relative;"" alt="" src=img/' +data.currently.icon+ '.png />';


html += '<table style="width: 100%"><tr><td class="auto-style4"><h3>' + data.currently.summary +'</h3></td></tr></table>';

html += '<table style="width: 100%"><tr><td class="auto-style3"><h5>'+ Date(1000 * data.currently.time).slice(0, 21) + '</h5></td></tr></table>';


 html += '</div>';

 $("#news").append(html).hide().fadeIn("slow");

 //next hour ..'


 var html = '';

  html += '<div style="top: 20px;position: relative;" class="alert alert-success" role="alert">خلال ساعة القادمة :  ' + data.hourly.summary + '</div>';

   $("#nexthour").append(html).hide().fadeIn("slow");

    //next days ..'

 var html = '';


    for (var d = 0; d < 7; d++) {

    var dDate = new Date(1000 * data.daily.data[d].time);
        var weekday = ["الاحد", "الاثنين", "الثلاثاء", "الاربعاء", "الخميس", "الجمعة", "السبت"];

    function firstTwoWords(str) {
        return str.split(/\s+/).slice(0, 2).join(" ");
    }

    var str = data.daily.data[d].summary;

        html += '<table class="table" align="right" dir="rtl" style="float: right" ><tr><td style="height: 32px">' + weekday[dDate.getDay()] + '</td><td style="height: 32px;text-align: left;">'+ Math.round(data.daily.data[d].temperatureMax) + '<td style="height: 32px"></tr></table>'
      }

    html += '</div>';

  $("#days").append(html).hide().fadeIn("slow");


 }
 });
 });//add this code. Need to close the 'jQuery(document)'
 } // a

0 个答案:

没有答案