从weather API获取每小时信息

时间:2013-11-06 19:28:49

标签: javascript ajax

我正在尝试从天气API访问每小时信息。 问题是它不适合我,我不是100%确定如何获取信息。

这是我正在使用的网站,以及每小时信息的页面。 http://www.wunderground.com/weather/api/d/docs?d=data/hourly&MR=1 我有一种强烈的感觉,它与访问变量的方式有关...

这是我的代码:

<script>
            jQuery(document).ready(function($) {
              $.ajax({

                  url: "http://api.wunderground.com/api/6368023a57d122c7/geolookup/conditions/q/DominicanRepublic/Barahona.json",
                  dataType : "jsonp",
                  success : function(parsed_json) {

                      //get the hourly info --  cant get hourly to work...
                      var month = parsed_json['hourly_forecast']['FCTTIME']['mon_padded'];
                      var day = parsed_json['hourly_forecast']['FCTTIME']['mday_padded'];
                      var year = parsed_json['hourly_forecast']['FCTTIME']['year'];
                      var time = parsed_json['hourly_forecast']['FCTTIME']['civil'];
                      var updated = month + "/" + day + "/" + year + " " + time;


                      var weather = parsed_json['hourly_forecast']['condition'];
                      var temp = parsed_json['hourly_forecast']['temp']['metric'];
                      var humid = parsed_json['hourly_forecast']['humidity'];

                      var wind_direction = parsed_json['hourly_forecast']['wdir']['dir'];
                      var wind_speed = parsed_json['hourly_forecast']['wspd']['metric'];

                      var wind_string = wind_direction + " " + wind_speed + " Km/h";

                      document.getElementById("weather").innerHTML = weather;
                      document.getElementById("temp").innerHTML = temp;
                      document.getElementById("hum").innerHTML = humid;
                      document.getElementById("wind").innerHTML = wind_string;        




                  }
              });
            });
        </script>

1 个答案:

答案 0 :(得分:0)

如果您从该URL打开JSON文件,您将看到它不包含“hourly_forecast”或“FCTTIME”。

修改

打开您正在下载的JSON文件,查看它发送给您的字段。 JQuery已经完成了很难,并将其解析为对象模型。此外,Chrome中的javascript调试程序非常适合向您展示JSON对象模型。您可以在“success”函数的开头设置断点,并使用“Local Variables”窗口来探索JSON对象。

在我更新它以使用JSON文件中正确的字段名后,这是你的代码...

<script>
jQuery(document).ready(function ($) {
    $.ajax({
        url: "http://api.wunderground.com/api/6368023a57d122c7/geolookup/conditions/q/DominicanRepublic/Barahona.json",
        dataType: "jsonp",
        success: function (parsed_json) {
            var current_observation = parsed_json.current_observation;

            var lastUpdated = current_observation.observation_time;

            var weather = current_observation.weather;
            var temp = current_observation.temp_c;
            var humid = current_observation.relative_humidity;

            var wind_direction = current_observation.wind_dir;
            var wind_speed = current_observation.wind_kph;

            var wind_string = wind_direction + " " + wind_speed + " Km/h";

            alert("Weather: " + weather + "\n"
                + "Temp: " + temp + "\n"
                + "Humidity: " + humid + "\n"
                + "Wind: " + wind_string + "\n"
                + lastUpdated
                );
        }
    });
});
</script>