本期介紹在R語(yǔ)言如何使用highcharter包繪制可交互的高級(jí)圖表铸抑，highcharter包是R語(yǔ)言中繪制Highcharts圖表的包贡耽。Highcharts 是用純JavaScript編寫(xiě)的一個(gè)圖表庫(kù)， 能夠很簡(jiǎn)單便捷的在Web網(wǎng)站或是Web應(yīng)用程序添 加有交互性的圖表鹊汛，并且免費(fèi)提供給個(gè)人學(xué)習(xí)蒲赂、個(gè)人網(wǎng)站和非商業(yè)用途使用。Highcharts詳情：www.hcharts.cn

上一期介紹了如何使用highcharter包繪制可交互的高級(jí)圖表的一部分刁憋，本期介紹高級(jí)圖表的剩余滥嘴，包括：箱線圖、瀑布圖至耻、漏斗圖若皱、桑基圖尘颓、詞云圖走触、熱力圖、帕累托圖疤苹、矩形樹(shù)圖的繪制饺汹。同樣的，請(qǐng)大家安裝highcharter 和data.table包并導(dǎo)入痰催，我們開(kāi)始詳細(xì)看一下各圖表的制作細(xì)節(jié)兜辞。

箱線圖

箱線圖又名盒須圖、盒式圖或箱線圖夸溶，主要用于反映原始數(shù)據(jù)分布的特征逸吵，以及進(jìn)行多組數(shù)據(jù)分布特征的比較。在highcharter中通過(guò)函數(shù)hcboxplot或函數(shù)hc_add_series_boxplot 均可實(shí)現(xiàn)箱線圖.

函數(shù)hc_add_series_boxplot:

box_data <- data.table(type =rep(c("1","2","3", "4","5"),each = 5) ,
                       num = c(760,801,1300,895,965,733,853,939,980,1080,714,762,890,870,918,724,802,806,871,950,834,836,864,882,910))

highchart() %>%
  hc_title(text = "箱線圖",align="center")%>%
  hc_yAxis(title = list(text = "觀測(cè)值"))%>%
  hc_legend(enabled = FALSE)%>%
  hc_add_series_boxplot(x = box_data$num, by = box_data$type, name = "type",
                        #是否顯示異常值缝裁，默認(rèn)值是TRUE
                        outliers = TRUE) %>%
  hc_add_theme(hc_theme_ft())

函數(shù)hcboxplot:

###箱線圖2
hcboxplot(x = box_data$num, var =box_data$type,name = "type" ) %>%
  hc_title(text = "箱線圖",align="center")%>%
  hc_yAxis(title = list(text = "觀測(cè)值"))%>%
  hc_legend(enabled = FALSE) %>%
  hc_add_theme(hc_theme_ft())

瀑布圖

瀑布圖的實(shí)現(xiàn)扫皱，相比其他圖需要進(jìn)行較多的設(shè)置，尤其是在輸入的數(shù)據(jù)項(xiàng)上面捷绑，詳情見(jiàn)代碼內(nèi)韩脑，瀑布圖的type值為waterfall.

waterfall_data <- data.table(name = c("啟動(dòng)資金","產(chǎn)品收入","服務(wù)收入","固定成本","可變成本","匯總"),
                             y = c(120000,569000,231000,-342000,-233000,NA),
                             isSUM = c(FALSE,FALSE,FALSE,FALSE,FALSE,TRUE),
                             isIntermediateSum = c(FALSE,FALSE,FALSE,FALSE,FALSE,TRUE),
                             color = c("#008FD5","#008FD5","#008FD5","#FF2700","#FF2700","#77AB43"))

highchart() %>% 
  hc_title(text = "瀑布圖",align="center") %>%
  
  hc_xAxis(#坐標(biāo)軸類型，設(shè)置后在hcaes中設(shè)置x即可
           type = "category") %>%
  hc_yAxis(title = list(text = "USD")) %>%
  hc_legend(enabled = FALSE) %>%
  hc_plotOptions(series = list(#圖內(nèi)柱子邊界線寬粹污，設(shè)置為0段多，取消顯示邊界線
                               borderWidth = 0))%>%
  hc_tooltip(pointFormat = "<b>${point.y}</b> USD") %>%
  hc_add_series(data = waterfall_data,type = "waterfall",
                hcaes(y = y,x= name,
                      #設(shè)置自動(dòng)計(jì)算匯總項(xiàng)
                      isSUM = isSUM,isIntermediateSum =isIntermediateSum,
                      color=color))%>%
  hc_add_theme(hc_theme_538())

漏斗圖

漏斗圖能夠直觀形象的展示數(shù)據(jù)的轉(zhuǎn)化路徑，其type的值為funnel,實(shí)現(xiàn)相對(duì)比較簡(jiǎn)單壮吩。

funnel_data <- data.table(type=c("訪問(wèn)商品","加入購(gòu)物車","提交訂單","點(diǎn)擊支付","支付成功"),
                          pv = c(15654,4064,1987,976,451))
highchart() %>% 
  hc_title(text = "電商轉(zhuǎn)化漏斗") %>%
  hc_plotOptions(series = list(dataLabels = list(
                                                 format = "<b>{point.name}</b> ({point.y:,.0f})"),
                               #控制漏斗圖的長(zhǎng)寬
                               neckWidth = "25%",neckHeight = "25%"
                               ))%>%
  hc_legend(enabled = FALSE)%>%
  hc_add_series(name ="電商",type = "funnel",data = funnel_data,hcaes(x= type,y = pv))%>%
  hc_add_theme(hc_theme_elementary())

山裕基圖

杉釉担基圖展現(xiàn)的是數(shù)據(jù)的流向，有起點(diǎn)和終點(diǎn)觉啊，連接起點(diǎn)和終點(diǎn)的曲線寬度表示數(shù)值的相對(duì)大小拣宏。桑基圖制作重點(diǎn)是需要注意輸入的數(shù)據(jù)格式杠人，保證其起點(diǎn)和終點(diǎn)順序清晰明確勋乾，這決定了最終呈現(xiàn)的效果。(如執(zhí)行后圖未展示嗡善，請(qǐng)以此方式重新安裝highcharter包：devtools::install_github("jbkunst/highcharter"))

sankey_data <- data.table(from = c("巴西",    "巴西",   "巴西",   "巴西",   "加拿大",  "加拿大",  "加拿大",  "墨西哥",  "墨西哥",  "墨西哥",  "墨西哥",  "美國(guó)",   "美國(guó)",   "美國(guó)",   "美國(guó)",   "葡萄牙",  "葡萄牙",  "葡萄牙",  "葡萄牙",  "法國(guó)",   "法國(guó)",   "法國(guó)",   "法國(guó)",   "法國(guó)",   "西班牙",  "西班牙",  "西班牙",  "英國(guó)",   "英國(guó)",   "英國(guó)",   "英國(guó)",   "南非",   "南非",   "南非",   "安哥拉",  "安哥拉",  "安哥拉",  "塞內(nèi)加爾", "塞內(nèi)加爾", "塞內(nèi)加爾", "馬里",   "馬里",   "馬里",   "摩洛哥",  "摩洛哥",  "摩洛哥"),
                          to = c("葡萄牙", "法國(guó)",   "西班牙",  "英國(guó)",   "葡萄牙",  "法國(guó)",   "英國(guó)",   "葡萄牙",  "法國(guó)",   "西班牙",  "英國(guó)",   "葡萄牙",  "法國(guó)",   "西班牙",  "英國(guó)",   "安哥拉",  "塞內(nèi)加爾", "摩洛哥",  "南非",   "安哥拉",  "塞內(nèi)加爾", "馬里",   "摩洛哥",  "南非",   "塞內(nèi)加爾", "摩洛哥",  "南非",   "安哥拉",  "塞內(nèi)加爾", "摩洛哥",  "南非",   "中國(guó)",   "印度",   "日本",   "中國(guó)",   "印度",   "日本",   "中國(guó)",   "印度",   "日本",   "中國(guó)",   "印度",   "日本",   "中國(guó)",   "印度",   "日本"),
                          weight = c(5, 1,  1,  1,  1,  5,  1,  1,  1,  5,  1,  1,  1,  1,  5,  2,  1,  1,  3,  1,  3,  3,  3,  1,  1,  3,  1,  1,  1,  2,  7,  5,  1,  3,  5,  1,  3,  5,  1,  3,  5,  1,  3,  5,  1,  3))

highchart() %>%
  hc_title(text = "墒锌。基圖") %>%
  hc_add_series(data = sankey_data,type = "sankey",hcaes(from = from,to = to,weight = weight)) %>%
  hc_add_theme(hc_theme_google())

詞云圖

詞云圖用于突出顯示文本中高頻關(guān)鍵詞匯，展示文本的核心重點(diǎn)滤奈。同樣的，其實(shí)現(xiàn)也非常簡(jiǎn)單撩满。

text_data <- data.table(text =c("巴西",   "加拿大",  "墨西哥",  "美國(guó)",   "葡萄牙",  "法國(guó)",   "西班牙",  "英國(guó)",   "南非",   "安哥拉",  "塞內(nèi)加爾", "馬里",   "摩洛哥",  "中國(guó)",   "印度",   "日本"),
                        weight =c(2,    3,  1,  1,  4,  5,  4,  3,  1,  1,  2,  3,  2,  6,  1,  1))

highchart() %>%
  #hc_title(text = "詞云圖") %>%
  hc_add_series(data = text_data,type = "wordcloud",name= "得分",hcaes(name = text,weight = weight)) %>%
  hc_add_theme(hc_theme_flat())

熱力圖

熱力圖的type值為heatmap蜒程，需要特別注意的是設(shè)置顏色的漸變需通過(guò)函數(shù)hc_colorAxis,設(shè)定其參數(shù)minColor 或maxColor 即可。

name <- c("Alexander",  "Marie",    "Maximilian",   "Sophia",   "Lukas",    "Maria",    "Leon", "Anna", "Tim",  "Laura")
weekday <- c("Monday", "Tuesday",   "Wednesday",    "Thursday", "Friday")
heatmap_data = data.table(name =rep(name,each = length(weekday)),
                          weekday =rep(weekday,times = length(name)),
                          sales = round(runif(length(weekday) * length(name),min=20,max=100),0))

highchart() %>%
  hc_title(text = "每周銷售數(shù)據(jù)",align="center")%>%
  hc_xAxis(categories = name) %>%
  hc_yAxis(categories = weekday)%>%
  hc_colorAxis(min = 0,minColor = "#FFFFFF") %>%
  hc_legend(align = "right",layout = "vertical",margin = 0,verticalAlign = "top",y = 25,symbolHeight = 400) %>%
  hc_tooltip(formatter = JS("function () {return '<b>' + this.series.xAxis.categories[this.point.x] + '</b> sold <br><b>' +
                                    this.point.value + '</b> items on <br><b>' + this.series.yAxis.categories[this.point.y] + '</b>';}")) %>%
  hc_add_series(name = "Sales per employee",data = heatmap_data,type = "heatmap",
                hcaes(x = name,y = weekday,value = sales),
                dataLabels = list(enabled = TRUE)) %>%
  hc_add_theme(hc_theme_538())

帕累托圖

帕累托圖是將出現(xiàn)的問(wèn)題或改進(jìn)項(xiàng)目按照重要程度依次排列而采用的一種圖表伺帘，是二八法則的圖形體現(xiàn)昭躺，用于分析問(wèn)題或項(xiàng)目的核心影響因素。帕累托圖有條形圖和折線圖組合而成伪嫁，其中的折線數(shù)據(jù)需要我們?cè)谧鲌D之前自行進(jìn)行一步計(jì)算领炫。

type = c("價(jià)格過(guò)高",    "分量過(guò)小", "等待時(shí)間過(guò)長(zhǎng)",   "食物難吃", "氛圍不好", "不衛(wèi)生",  "太吵",   "服務(wù)態(tài)度不好")
num  =  c(755, 222, 151, 86, 72, 51, 36, 10)
rate = round(cumsum(num) / sum(num) *100,2)
highchart() %>%
  hc_title(text = "餐廳投訴情況",align = "center") %>%
  hc_plotOptions(series = list(#圖內(nèi)柱子邊界線寬，設(shè)置為0张咳，取消顯示邊界線
                                borderWidth = 0)) %>%
  hc_xAxis(categories = type) %>%
  hc_yAxis_multiples(
           list(
             title = list(text = ""),
             tickPositions = c(0,200,400,600,800)),
           list(
             title = list(text = ""),
             minPadding = 0,
             maxPadding = 0,
             max = 100,
             min = 0,
             opposite = TRUE,
             labels = list(format = "{value}%"),
             tickPositions = c(0,25,50,75,100)
           )
           )%>%
  hc_tooltip(pointFormat = "{series.name} {point.y:.2f} %")%>%
  hc_add_series(name = "投訴次數(shù)",type = "column",zIndex=1,data = num) %>%
  hc_add_series(type = "line",name = "累計(jì)比率",data = rate,yAxis =1,zIndex = 2) %>%
  hc_add_theme(hc_theme_economist())

矩形樹(shù)圖

矩形樹(shù)圖類似熱力圖帝洪，通過(guò)函數(shù)hc_colorAxis設(shè)置顏色隨值的變化，不同是還需在hc_add_series中設(shè)置colorValue的值才能最終實(shí)現(xiàn)顏色變化脚猾。另外矩形樹(shù)圖的type值為treemap.

tree_data <- data.table(country_name =c("巴西",   "加拿大",  "墨西哥",  "美國(guó)",   "葡萄牙",  "法國(guó)",   "西班牙",  "英國(guó)",   "南非",   "安哥拉",  "塞內(nèi)加爾", "馬里",   "摩洛哥",  "中國(guó)",   "印度",   "日本"),
                        value =c(2, 3,  1,  1,  4,5,    4,  3,  1,  1,  2,  3,  2,  6,  1,  1))

highchart() %>%
  hc_colorAxis(     maxColor = "#0043AE")%>%
  hc_title(text = "矩形樹(shù)圖")%>%
  hc_add_series(data = tree_data,type = "treemap",hcaes(name = country_name,value = value,colorValue =value),layoutAlgorithm = "squarified") %>%
  hc_add_theme(hc_theme_google())