R實習筆記(二)-取得環保署網頁的AQI色碼
HSIANG-YUN CHAN
2018年10月4日
以下為實習被追殺的日子part1連結:
R實習筆記(一)-2008~2017年全臺一般空氣品質測站資料整理
爬爬網頁紓壓一百分，實習當中覺得很有趣的結果(◉ω◉)
主要練習CSS選擇器，拆解CSS龐大字串後，使用正則表達式抓取特定字串。
目錄
一. 背景與目的
為了繪製AQI的日曆圖，需要收集到AQI的色碼，所以我就潛入html中啦~
圖一 AQI日曆圖
圖二 實際html網頁中AQI色碼存在位置示意圖
二.材料與方法
環境
windows version 1803 (10.0.17134) , R version 3.5.1 , RStudio version 1.1.453
使用套件
xml2 , rvest , magrittr
建立抓取網頁css模板的自建函數
1.抓取環保署網頁和其css的html檔
- 讀取網頁html檔，抓取head標籤下link節點，取得此節點下href屬性中的css模板網址。
- 取得href屬性中的css樣式板html網頁所有內容。
2.拆解css取得RGB色碼
- 以“}”拆開css字串。
- 取得名為.AQI系列的css樣式表，以下為使用正則表達式解釋:
代表AQI前方接，而AQI和back中間接，只要符合這樣模式的字串，就會被抓取。
- 取得background-color:的位置
圖三 目標CSS階層式樣式表的示意圖
因為要避開冒號有兩個位置，而只抓取color:會抓到前方的RGB色碼，所以直接 抓取background-color:中b的位置後，再加上background-color:的字元數後， 即可取得第二個冒號的位置。
- 取得第二個冒號的位置到字尾(substring只放截取開頭字串即會截到字尾)，最終即可取得RGB色碼。
library(xml2);library(rvest);library("magrittr")
AQIcolor<-function(url){
#1.抓html檔
css<-url%>% read_html() %>% html_nodes("head>link") %>% html_attr("href") #爬網頁
css.text<-paste0("https://taqm.epa.gov.tw",css)%>% read_html() %>% html_nodes("body") %>% html_text
#2.拆字串
text <-strsplit(css.text,"}")
text<-text[[1]][which(grepl(".AQI.+back",text[[1]])==T)]
aim<-regexpr(text,pattern="background-color:")+nchar("background-color:")
outcome<-substring(text,aim)
}三.結果
放入環保署中文版與英文版網址
1.放入環保署英文版網址。
2.放入環保署中文版網址。
3.建立AQI色表:
- Range:AQI數值區間
- English_RGB:英文版網頁RGB色碼
- TW_RGB:中文版網頁RGB色碼
#目標:環保署英文版網址
en.rgb<-AQIcolor("https://taqm.epa.gov.tw/taqm/en/b0201.aspx")
#目標:環保署中文版網址
tw.rgb<-AQIcolor("https://taqm.epa.gov.tw/taqm/tw/b0201.aspx")
AQI<-list("Range" = c("0～50","51～100", "101～150", "151～200", "201～300" ,"301～500"),"English_RGB"=en.rgb,"TW_RGB"=tw.rgb) %>% as.data.frame()
knitr::kable(AQI,format = "markdown",align = 'c')| Range | English_RGB | TW_RGB |
|---|---|---|
| 0～50 | #0f0 | #00e800 |
| 51～100 | #ff0 | #ff0 |
| 101～150 | #ff7e00 | #ff7e00 |
| 151～200 | red | red |
| 201～300 | purple | #8f3f97 |
| 301～500 | #7e0023 | #7e0023 |
最後比較台灣環保署的中英文版網頁中，AQI區間:0-50和201-300的RGB色碼不同(●‘Д’●)，剛看到爬完的結果時，我還以為我眼睛業障重。
四.討論
- 與其他國家比較環保署對於AQI的定義:
將我爬完的台灣環保署AQI的RGB色碼資料和美國與中國比較後，發現只有台灣奇葩的沒有定義AQI的RGB色碼資料，而且美國與中國甚至定義了AQI的CMYK(印刷色)。
- 與其他國家比較環保署網頁對於AQI的定義:
到USEPA網頁上打開AQI顏色的原始碼，也是與其定義的RGB色碼相同。
總結而言，台灣環保署的中英網頁裡的AQI色碼不一致，導致我們於繪製圖表時，無法準確定義AQI的RGB色碼，希望以後台灣能有官方文件定義AQI的RGB色碼。
圖三 台灣，美國和中國AQI色碼比較
五.結論
我最後決定用英文版網頁的RGB色碼啦!
但是從網頁抓取的RGB色碼不能在R中直接使用，所以我還要寫個轉換RGB的code了。
knitr::kable(AQI[1:2],format = "markdown",align = 'c', padding = 2)| Range | English_RGB |
|---|---|
| 0～50 | #0f0 |
| 51～100 | #ff0 |
| 101～150 | #ff7e00 |
| 151～200 | red |
| 201～300 | purple |
| 301～500 | #7e0023 |