利用json取得公開資料(2)

在上回已經取得資料，這次就來把取回來的資料放入到表格內。

$.each

取回的資料是很多個物件，物件內還有著陣列，陣列內都包含著一個名稱及一個值(如下圖)，物件內包含著"SiteName"的名稱及"嘉義"等地名的值，首先要把每一個物件拆開，就需要用到$.each。

(function() {
  var epaAPI = "http://opendata.epa.gov.tw/ws/Data/UV/?$orderby=PublishAgency&$skip=0&$top=1000&format=json&callback=?";
  $.getJSON( epaAPI, function(){
    format: "json"
  }).done(function(data) {
      $.each( data, function( i, item ) {
      	//把每一個物件拆開來執行一次function
      	console.log(item);
      });
    });
})();

接下來的console(item)就會看到上面那張圖的內容。

取出個別的資料

這份資料相當的多，所以要先做個過濾，從上面得知的結果，他有一個county的名稱，裡面有不同的縣市名稱，試試看取出高雄市的資料就好。先定義一個變數"_DefaultContry"其值為高雄市。

另外在資料可以用item.SiteName的方式取出，等等就一次做完吧~。

(function() {
  var epaAPI = "http://opendata.epa.gov.tw/ws/Data/UV/?$orderby=PublishAgency&$skip=0&$top=1000&format=json&callback=?";
  var list = ''
  _DefaultContry = '高雄市'
  //定義高雄市的變數

  $.getJSON( epaAPI, function(){
    format: "json"
  }).done(function(data) {
      $.each( data, function( i, item ) {
      	console.log(item);
      	if(item.County == _DefaultContry){ //假設是高雄市才執行
       		list = ''+ item.SiteName+''+ item.PublishTime+''+ item.TWD97Lon+''+ item.UVI+'';
			//利用item.值，把每一個值取出，並寫成一個html存在list的變數內

			$('.itemlist').append(list);
			//最後把剛剛的html放到表格內
		};	
      });
    });
})();

最後就會產生如下的結果(如果沒有失聯的話，下面是有內容的...)。

測站名稱	發布時間	經度(TWD97)	紫外線指數

撰寫一篇文章需要花上非常多的時間，如果你關閉 Adblock (廣告阻擋器)，我會非常的開心 🤗。 (╭(°A°`)╮))

上一篇：利用json取得公開資料

下一篇： 利用json取得公開資料(3) 並繪製圖表