0

I'm trying to extract the weather from Yahoo using YQL. However for some reasons nothing returns, however I have tried manually to call the URL with the Select statement is it does returns the results I wanted. Can someone help to debug that went wrong with my codes?

$(function(){

    var loc1 = 'Singapore, Singapore'; // Singapore
    var u = 'c';
    var query1 = "SELECT * FROM weather.forecast WHERE woeid in (select woeid from geo.places(1) where text='" + loc1 + "' AND u='" + u + "'";
    var cacheBuster = Math.floor((new Date().getTime()) / 3600 / 1000);

    var url1 = 'https://query.yahooapis.com/v1/public/yql?q=' + encodeURIComponent(query1) + '&format=json&_nocache=' + cacheBuster;

    window['wxCallback1'] = function(data) {
        var info = data.query.results.channel;
        $('#wxIcon1').append('<img src="weathericon/' + info.item.condition.code + '.gif" width="52" height="52" title="' + info.item.condition.text + '" /><br>' + info.item.condition.text + '<br>');
        $('#wxTemp1').html(info.item.forecast[0].low + '<font style="FONT-WEIGHT:normal; FONT-SIZE:12px">&deg;' + (u.toUpperCase()) + '</font>' + ' - ' + info.item.forecast[0].high + '<font style="FONT-WEIGHT:normal; FONT-SIZE:12px">&deg;' + (u.toUpperCase()) + '</font>');
        $('#wxHum1').html(info.atmosphere.humidity + '<font style="FONT-WEIGHT:normal; FONT-SIZE:12px">%</font>');

    };
    $.ajax({
        url: url1,
        dataType: 'jsonp',
        cache: true,
        jsonpCallback: 'wxCallback1'
    });

});

1 Answers1

0

Managed to find the problem. Here's the full working codes including the HTML section which was left out earlier. Do note that the condition code denotes the graphic file to be displayed. See https://www.igorkromin.net/index.php/2015/09/11/yahoo-weather-condition-code-to-weather-icons-font-mapping/

<!doctype html>
<html lang="en">
    <HEAD>
<META http-equiv="Page-Enter" CONTENT="RevealTrans(Duration=3,Transition=23)">
<title>selWeather</title>

</HEAD>

<body topmargin="0" leftmargin="0" style="BACKGROUND-COLOR:transparent">

<table cellpadding="1" cellspacing="1" border="0" width="194">
      <tr>
        <td colspan="2" valign="middle" bgcolor="#d0690a">
          <font style="FONT-SIZE:10px; COLOR:#ffffff; FONT-FAMILY:Arial, helvtical, verdana, tahoma">
          SINGAPORE<br>
          </font>
        </td>
      </tr>
      <tr>
        <td rowspan="3" valign="middle" align="center" width="50%">
          <font style="FONT-SIZE:10px; COLOR:#000000; FONT-FAMILY:Arial, helvtical, verdana, tahoma">
          <span id="wxIcon1"></span>
          </font><br>
        </td>
        <td valign="middle" align="center">
          <font style="FONT-SIZE:10px; COLOR:#000000; FONT-FAMILY:Arial, helvtical, verdana, tahoma">
          TEMPERATURE</font><br>
          <font style="FONT-WEIGHT:bold; FONT-SIZE:20px; COLOR:#000000">
          <span id="wxTemp1"></span>
        </td>
      </tr>
      <tr>
        <td height="1" bgcolor="#999999"></td>
      </tr>
      <tr>
        <td valign="top" align="center">
          <!-- <hr style="WIDTH: 90%; COLOR: #999999; HEIGHT: 1px"> -->
          <font style="FONT-SIZE:10px; COLOR:#000000; FONT-FAMILY:Arial, helvtical, verdana, tahoma">
          HUMIDITY</font><br>
          <font style="FONT-WEIGHT:bold; FONT-SIZE:20px; COLOR:#000000">
          <span id="wxHum1"></span></font><br>
        </td>
      </tr>
      </table>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>

<script type="text/javascript">

$(function(){

    var loc1 = 'Singapore, Singapore'; // Singapore
    var u = 'c';
    var query1 = "SELECT * FROM weather.forecast WHERE woeid in (select woeid from geo.places(1) where text='" + loc1 + "') AND u='" + u + "'";
    var cacheBuster = Math.floor((new Date().getTime()) / 3600 / 1000);

    var url1 = 'https://query.yahooapis.com/v1/public/yql?q=' + encodeURIComponent(query1) + '&format=json&_nocache=' + cacheBuster;

    window['wxCallback1'] = function(data) {
        var info = data.query.results.channel;
        $('#wxIcon1').append('<img src="weathericon/' + info.item.condition.code + '.gif" width="52" height="52" title="' + info.item.condition.text + '" /><br>' + info.item.condition.text + '<br>');
        $('#wxTemp1').html(info.item.forecast[0].low + '<font style="FONT-WEIGHT:normal; FONT-SIZE:12px">&deg;' + (u.toUpperCase()) + '</font>' + ' - ' + info.item.forecast[0].high + '<font style="FONT-WEIGHT:normal; FONT-SIZE:12px">&deg;' + (u.toUpperCase()) + '</font>');
        $('#wxHum1').html(info.atmosphere.humidity + '<font style="FONT-WEIGHT:normal; FONT-SIZE:12px">%</font>');

    };
    $.ajax({
        url: url1,
        dataType: 'jsonp',
        cache: true,
        jsonpCallback: 'wxCallback1'
    });

});

</script>
</body>
</HTML>