本期介紹在R語言如何使用highcharter包繪制可互動的進階圖表，highcharter包是R語言中繪制Highcharts圖表的包。Highcharts 是用純JavaScript編寫的一個圖表庫， 能夠很簡單便捷的在Web網站或是Web應用程式添 加有互動性的圖表，并且免費提供給個人學習、個人網站和非商業用途使用。Highcharts詳情：www.hcharts.cn
上一期介紹了如何使用highcharter包繪制可互動的進階圖表的一部分，本期介紹進階圖表的剩餘，包括：箱線圖、瀑布圖、漏鬥圖、桑基圖、詞雲圖、熱力圖、帕累托圖、矩形樹圖的繪制。同樣的，請大家安裝highcharter 和data.table包并導入，我們開始詳細看一下各圖表的制作細節。
箱線圖
箱線圖又名盒須圖、盒式圖或箱線圖，主要用于反映原始資料分布的特征，以及進行多組資料分布特征的比較。在highcharter中通過函數hcboxplot或函數hc_add_series_boxplot 均可實作箱線圖.
函數hc_add_series_boxplot:
box_data
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 = "觀測值"))%>%
hc_legend(enabled = FALSE)%>%
hc_add_series_boxplot(x = box_data$num, by = box_data$type, name = "type",
#是否顯示異常值，預設值是TRUE
outliers = TRUE) %>%
hc_add_theme(hc_theme_ft())
函數hcboxplot:
###箱線圖2
hcboxplot(x = box_data$num, var =box_data$type,name = "type" ) %>%
hc_title(text = "箱線圖",align="center")%>%
hc_yAxis(title = list(text = "觀測值"))%>%
hc_legend(enabled = FALSE) %>%
hc_add_theme(hc_theme_ft())
瀑布圖
瀑布圖的實作，相比其他圖需要進行較多的設定，尤其是在輸入的資料項上面，詳情見代碼内，瀑布圖的type值為waterfall.
waterfall_data
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(#坐标軸類型，設定後在hcaes中設定x即可
type = "category") %>%
hc_yAxis(title = list(text = "USD")) %>%
hc_legend(enabled = FALSE) %>%
hc_plotOptions(series = list(#圖内柱子邊界線寬，設定為0，取消顯示邊界線
borderWidth = 0))%>%
hc_tooltip(pointFormat = "
${point.y}USD") %>%
hc_add_series(data = waterfall_data,type = "waterfall",
hcaes(y = y,x= name,
#設定自動計算彙總項
isSUM = isSUM,isIntermediateSum =isIntermediateSum,
color=color))%>%
hc_add_theme(hc_theme_538())
漏鬥圖
漏鬥圖能夠直覺形象的展示資料的轉化路徑，其type的值為funnel,實作相對比較簡單。
funnel_data
pv = c(15654,4064,1987,976,451))
highchart() %>%
hc_title(text = "電商轉化漏鬥") %>%
hc_plotOptions(series = list(dataLabels = list(
format = "
{point.name}({point.y:,.0f})"),
#控制漏鬥圖的長寬
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())
桑基圖
桑基圖展現的是資料的流向，有起點和終點，連接配接起點和終點的曲線寬度表示數值的相對大小。桑基圖制作重點是需要注意輸入的資料格式，保證其起點和終點順序清晰明确，這決定了最終呈現的效果。
sankey_data
to = c("葡萄牙", "法國", "西班牙", "英國", "葡萄牙", "法國", "英國", "葡萄牙", "法國", "西班牙", "英國", "葡萄牙", "法國", "西班牙", "英國", "安哥拉", "塞内加爾", "摩洛哥", "南非", "安哥拉", "塞内加爾", "馬裡", "摩洛哥", "南非", "塞内加爾", "摩洛哥", "南非", "安哥拉", "塞内加爾", "摩洛哥", "南非", "中國", "印度", "日本", "中國", "印度", "日本", "中國", "印度", "日本", "中國", "印度", "日本", "中國", "印度", "日本"),
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())
詞雲圖
詞雲圖用于突出顯示文本中高頻關鍵詞彙，展示文本的核心重點。同樣的，其實作也非常簡單。
text_data
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，需要特别注意的是設定顔色的漸變需通過函數hc_colorAxis,設定其參數minColor 或maxColor 即可。
name
weekday
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 = "每周銷售資料",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 '
' + this.series.xAxis.categories[this.point.x] + 'sold
' +this.point.value + ' items on
' + this.series.yAxis.categories[this.point.y] + '';}")) %>%
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())
帕累托圖
帕累托圖是将出現的問題或改進項目按照重要程度依次排列而采用的一種圖表，是二八法則的圖形展現，用于分析問題或項目的核心影響因素。帕累托圖有條形圖和折線圖組合而成，其中的折線資料需要我們在作圖之前自行進行一步計算。
type = c("價格過高", "分量過小", "等待時間過長", "食物難吃", "氛圍不好", "不衛生", "太吵", "服務态度不好")
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(#圖内柱子邊界線寬，設定為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 = "投訴次數",type = "column",zIndex=1,data = num) %>%
hc_add_series(type = "line",name = "累計比率",data = rate,yAxis =1,zIndex = 2) %>%
hc_add_theme(hc_theme_economist())
矩形樹圖
矩形樹圖類似熱力圖，通過函數hc_colorAxis設定顔色随值的變化，不同是還需在hc_add_series中設定colorValue的值才能最終實作顔色變化。另外矩形樹圖的type值為treemap.
tree_data
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 = "矩形樹圖")%>%
hc_add_series(data = tree_data,type = "treemap",hcaes(name = country_name,value = value,colorValue =value),layoutAlgorithm = "squarified") %>%
hc_add_theme(hc_theme_google())