使用 Dark Sky API 显示每日天气答案

【问题标题】：Displaying daily weather with Dark Sky API使用 Dark Sky API 显示每日天气
【发布时间】：2017-04-27 10:33:28
【问题描述】：

我无法让我的天气应用使用 Dark Sky API 处理 5 天的预报。我能够使用“当前”作为我的网址中的关键词来显示天气，但我无法使用“每日”作为关键词来显示任何信息。我知道这被标记为重复，但它正在寻找如何使用 JSON（而不是 JSONP）使用 Dark Sky API 显示数据，以便预测显示一周的信息，而不仅仅是 1 天的信息。

关于如何让它发挥作用的任何想法？

这是我到目前为止的代码：

HTML

 <div class="container">
  <!-- Month and Year -->
  <div class="row">
    <div class="col-md-6"></div>
    <div class="col-md-6">
      <p id="monthNum"></p>
      <p id="year"></p>
    </div>
  </div>
  <!-- END Month and Year -->

  <!-- Weather Forecast -->
  <div id="weather">
    <div class="row">
      <div id="currentDay" class="col-md-2">
        <div class="thumbnail current-thumbnail">
          <div class="row">
            <div class="col-sm-12">
              <p class="time text-center"></p>
              <p class="location text-center"></p>
              <p class="tempFeel text-center"></p>
              <p class="humidity text-center"></p>
            </div>
          </div>
          <p class="text-uppercase text-center"><span class="forecastToday">Thu</span> <br /> <span class="forecastNumToday">14</span></p>
           <p class="icon text-center"></p>
           <p class="temp text-center"></p>
        </div>
      </div>
      <div class="col-md-2">
        <div class="thumbnail">
          <p class="text-uppercase text-center"><span class="forecastDay">Fri</span> <br /> <span class="forecastNum">15</span></p>
          <p class="icon-upcoming text-center"></p>
        </div>
      </div>
      <div class="col-md-2">
        <div class="thumbnail">
          <p class="text-uppercase text-center"><span class="forecastDay">Sat</span> <br /> <span class="forecastNum">16</span></p>
          <p class="icon-upcoming text-center"></p>
        </div>
      </div>
      <div class="col-md-2">
        <div class="thumbnail">
          <p class="text-uppercase text-center"><span class="forecastDay">Sun</span> <br /> <span class="forecastNum">17</span></p>
          <p class="icon-upcoming text-center"></p>
        </div>
      </div>
      <div class="col-md-2">
        <div class="thumbnail">
          <p class="text-uppercase text-center"><span class="forecastDay">Mon</span> <br /> <span class="forecastNum">18</span></p>
          <p class="icon-upcoming text-center"></p>
        </div>
      </div>
    </div>
  </div>
  <!-- END Weather Forecast -->
</div>

    //Get the user's position
    if (navigator.geolocation) {
  navigator.geolocation.getCurrentPosition(function(position) {

    var lat = position.coords.latitude;
    var long = position.coords.longitude;

    //Dark Sky API key 
    var apiKey = "API-KEY";

    //Dark Sky URL 
    var weatherURL = "https://api.darksky.net/forecast/";

    //Cross-Origin URL to allow use on Chrome
    var corsURL = "https://cors-anywhere.herokuapp.com/";

    //Full Weather Forecast URL
    var fullURL = corsURL + weatherURL + apiKey + "/" + lat + "," + long + "?exclude=currently,hourly,flags";

    //jQuery JSON call to pull in temperature and icon information
    $.getJSON(fullURL, function(json) {

      for (i = 0; i < json.data.length; i++) {
        var temp = json.data.temperatureMax;
        //console.log(temp);
      }
      //Display the Current temp in Farenheit

      //$('.temp').html(temp + "&deg;F");

      var icon = json.daily.icon;
      //console.log(icon);
      $(".icon").html("<i class='wi wi-forecast-io-" + icon +"'></i>");
    });

【问题讨论】：

究竟是什么问题？哪些代码没有按照您的预期执行，反之亦然？
你确定这个 API 不返回 jsonp 吗？
这与被引用为重复的问题不同。 API 不返回 JSONP，它是常规的 JSON。这是该网站提供的 JSON 数据示例：[link]darksky.net/dev/docs/forecast我正在尝试显示本周的天气，而不仅仅是当天的天气，这是我一直想弄清楚的。

标签： jquery weather-api

【解决方案1】：

快速回答：

为了从黑暗天空 API 访问更多的当前天气：

today = json['daily']['data'][0]['temperatureHigh']
tomorrow = json['daily']['data'][1]['temperatureHigh']
. . .

更改第三个 [] 中的数字以获得您想要的每一天（例如 [4]），它从 0 变为 7。在最后一个 [] 中，您可以使用关键字从 json 访问不同的变量（例如，'temperatureLow'、'humanity' 等）

一点额外的：

基本上问题应该是如何访问 json 文件。如果您在浏览器 url 中输入请求 (https://api.darksky.net/forecast/api_key/lat,lon?units=auto)。你会得到一个巨大的 json 字符串。如果你解析它，应该清楚哪些元素是为了什么。

【讨论】：