2017-03-04 17 views
0

これが私の最初の質問です。私は自分自身を徐々にゆっくりと前に突きつけますこのJSONデータのURLをHTMLとして提示したいと思います。日の出と月の入りの両方を表示したり、設定したりします。以下は、JSON URL、JSON、月データにまだ手が入らない不器用なスクリプトです。 Problaryは数時間前にそれに近いものでした。問題は、私が思うJSON配列データです。その後、私はAPIページを貼り付けます。本当に誰かが助けられることを願っています。 : ありがとうございました。USNO Moonrise&Sunrise JSONデータ配列の使い方は?

Marcus

PS。してください、noobieアラートをクリアしてください! one-liners &わかりやすい例は私にとってはほとんどありません。

URL

http://api.usno.navy.mil/rstt/oneday?date=today&coords=9S,147E&tz=10 

JSON

{ 
"error":false, 
"apiversion":"2.0.0", 
"year":2017, 
"month":3, 
"day":4, 
"dayofweek":"Saturday", 
"datechanged":false, 
"lon":147.000000, 
"lat":9.000000, 
"tz":10, 

"sundata":[ 
      {"phen":"BC", "time":"06:04"}, 
      {"phen":"R", "time":"06:25"}, 
      {"phen":"U", "time":"12:24"}, 
      {"phen":"S", "time":"18:23"}, 
      {"phen":"EC", "time":"18:44"}], 

"moondata":[ 
      {"phen":"R", "time":"10:50"}, 
      {"phen":"U", "time":"17:12"}, 
      {"phen":"S", "time":"23:36"}], 

"closestphase":{"phase":"First Quarter","date":"March 5, 2017","time":"21:32"}, 
"fracillum":"34%", 
"curphase":"Waxing Crescent" 
} 

UPDATED! EARLIER

<script> 
    $.getJSON("http://api.usno.navy.mil/rstt/oneday?date=today&coords=9S,147E&tz=10", function(data) { 
    console.log(data); 


     // Set the variables from the results array 
     var dusk = ["sundata"][0]["BC.time"]; 
     console.log(data); 

     var rise = ["sundata"][0]["R.time"]; 
     console.log(data); 

     var noon = ["sundata"][0]["U.time"] 
     console.log(data); 

     var sets = ["sundata"][0]["S.time"]; 
     console.log(data); 

     var dawn = ["sundata"][0]["EC.time"]; 
     console.log(data); 

     // Set the table td text 
     $('BC').text(dusk); 
     $('R').text(rise); 
     $('U').text(noon); 
     $('S').text(sets); 
     $('EC').text(dawn); 
    });   
    </script>   
    </head>  
    <body>   
    <h1>MOONSUN</h1> 
     <hr/> 
     <table border="1">   
       <td>DAWN:</td> 
       <td id="BC"></td> 
      </tr> 
      <tr> 
       <td>RISE:</td> 
       <td id="R"></td> 
      </tr> 
      <tr> 
       <td>NOON:</td> 
       <td id="U"></td> 
      </tr> 
        <tr> 
       <td>SET:</td> 
       <td id="S"></td> 
      </tr> 
        <tr> 
       <td>DUSK:</td> 
       <td id="EC"></td> 
      </tr> 
     </table> 
    </div> 
</body> 

APIのLINK

http://aa.usno.navy.mil/data/docs/api.php

AS CODE OF STATE
$.getJSON("http://api.usno.navy.mil/rstt/oneday?date=today&coords=9S,147E&tz=10", function(data) { 

    data.sundata.forEach(function (sd) { 
    $('#'+sd.phen).text(sd.time) 
    }) 
var rise = data.moondata[0].time; 
var tran = data.moondata[1].time; 
var sets = data.moondata[2].time; 

    // Set the table td text 
    $('#R').text(rise); 
    $('#U').text(tran); 
    $('#S').text(sets); 
} 

}) 

CODE

NEW JSFIDDLE

[リンク] http://jsfiddle.net/kmg747/4egLxu2e/

+0

私はあなたがこの問題が閉鎖する前に解決されているのを見てもらいたいと思っていましたが、「広範に」は私によれば間違って分類されています。問題は、特定の問題を解決するように求められました。そしてそうだった。 – kmg

答えて

0

まず最初は、何も情報var dusk = data["sundata"][0]["BC.time"]を取得するには、データオブジェクトにアクセスする必要があります。そこにあるデータオブジェクトに注意してください。

配列やネストされたオブジェクトからデータをアクセス/処理する方法も間違っています。エンドポイントは、Object({})のString、Boolan、Array([])のプロパティを持つオブジェクトを返しています。インデックスであなたがアレイにアクセスするには

は、arr[0]のように、あなたがobj.propertyIWantまたはobj['propertyIWant']

を行うとjQueryでIDによって要素にアクセスするには、オブジェクトのために、あなたは$('#BC')のように、要素IDの前に#を必要としています。あなたはエンドポイントから得た情報を使用して、これらの変数を設定せずに

var dusk = data.sundata[0].time; 
var rise = data.sundata[1].time; 
var noon = data.sundata[2].time; 
var sets = data.sundata[3].time; 
var dawn = data.sundata[4].time; 

あるいは、より直接的な方法で、:あなたはあなたのような何かを行う必要があります何をしたいのかについては

data.sundata.forEach(function (sd) { 
    $('#'+sd.phen).text(sd.time) 
}) 

HTTPS接続を使用していて、HTTPリンクからフェッチしようとしているため、JSFiddleリンクからURLを取得できません。動作させるには、HTTPからFiddleを使用する必要があります。詳細情報here

を確認した後、hereはあなたがしようとしているものの最新バージョンです。返される場合と返されない場合がある値を扱う必要があるかもしれません。

+0

どうもありがとうございました。私は月データを今追加できると思う。 – kmg

+0

こんにちは@kmg! StackOverflowへようこそ。これまたは任意の回答があなたの質問を解決した場合は、チェックマークをクリックして[受諾](http://meta.stackexchange.com/q/5234/179419)を検討してください。これは、あなたが解決策を見つけ出し、回答者とあなた自身の両方に評判を与えていることを広範なコミュニティに示します。これを行う義務はありません。 – giorni

+0

Howdy @giorniもう一度おねがいします。しかし、私はまだ太陽と月の両方のデータがsundataを追い越し、それを 'R'、 'U'、 'S'であるmoondataで置き換えたので、まだ問題があります\t しかし、これは: var rise = data.moondata [1] .time; var noon = data.moondata [2] .time; var sets = data.moondata [3] .time; – kmg

関連する問題