R语言：如何对highcharter包绘制的图表进行优化

Highcharts 是一个用纯JavaScript编写的一个图表库， 能够很简单便捷的在Web网站或是Web应用程序添 加有交互性的图表，并且免费提供给个人学习、个人网站和非商业用途使用。highcharter包是R语言中绘制Highcharts图表的包，本期介绍在R语言如何对使用highcharter包绘制的图表进行图表优化。Highcharts详情：www.hcharts.cn

本期将介绍如何对highcharter包绘制的图表进行常见的设置和优化,接下来全文中用到的数据集都是ggplot2中的mpg数据集，请自行导入数据集。另外，也请导入本文的主角highcharter包。

坐标轴

坐标轴的值

利用highcharter包绘图时，基本不需要进行额外的坐标轴调整，因为其本身内置的机制就存在相应的优化，最终输出的图表坐标轴的值一般都会比较合适。不过实际需求千变万化，仍会存在需要修改的时候，一般通过hc_yAxis 和hc_xAxis中设置参数tickPositions 或labels中的step的值进行坐标轴值的调整,同时通过设置labels中的format调整坐标轴值的格式

在进行调整之前，我们先看看不进行设置的是什么样的。基本上坐标轴的值不用怎么调整，主要是为了对比接下来的参数设置带来的差异。

hchart(mpg, "scatter", hcaes(x = "displ", y = "hwy"))

设置参数tickPositions，直接指定坐标轴上的值。

hchart(mpg, "scatter", hcaes(x = "displ", y = "hwy")) %>%   hc_yAxis(tickPositions = c(0,15,30,45,60)) %>%  hc_xAxis(tickPositions = c(0,2,4,6,8))

设置参数labels中的step，通过调整值的步长，调整坐标轴的值。

hchart(mpg, "scatter", hcaes(x = "displ", y = "hwy")) %>%  
 hc_yAxis(labels = list(step = 2)) %>%  hc_xAxis(labels = list(step = 2))

设置参数labels中的format，指定坐标轴的值显示的格式。mpg数据集中的字段cyl表示气缸数量，我们作图展示不同气缸数在数据集中的行数，然后对横坐标进行设置显示成比如4缸.

#准备数据
library(data.table)library(dplyr)library(plyr)
mpg <- data.table(mpg)cyl_num <- mpg[,.N,by = cyl][order(cyl)] %>% mutate(.,cyl = factor(cyl))
#设置横坐标轴的值格式
hchart(cyl_num, "column", hcaes(x = "cyl", y = "N")) %>%   hc_xAxis(labels = list(format = '{value} 缸' ))

坐标轴的标题

坐标轴的标题通过设置hc_yAxis和``hc_xAxis中的参数title`进行设置。

#坐标轴标题
hchart(mpg, "scatter", hcaes(x = "displ", y = "hwy")) %>%  hc_yAxis(title = list(text = "每加仑英里数")) %>%  hc_xAxis(title = list(text = "发动机排量"))

参考标识

参考标识_参考线

对图表进行参考线设置，同样是在hc_yAxis和hc_xAxis中实现，对参数plotLines中的系列值进行设置，来调整参考线的一系列设定，这些需要设置的值主要为：
label:参考线名称
dashStyle:线的类型（solid【实线】、Dash【虚线】、shortDash【短虚线】、shotDot【点线】等）
value:在坐标轴上显示的位置
width:标示线的宽度
color:标示线的颜色

hchart(mpg, "scatter", hcaes(x = "displ", y = "hwy")) %>%  hc_xAxis(plotLines = list( list(   label = list(text = "参考线"),   dashStyle = "solid",   value = 5,   width = 2,   color = "red")))

参考标识_参考区域

在hc_yAxis和hc_xAxis中对参数plotBands的系列值进行设置，即可实现参考区域的设置，这些值主要为：
label:参考区域设置文字
from:参考区域开始值
to:参考区域结束值
color: 参考区域的背景颜色

hchart(mpg, "scatter", hcaes(x = "displ", y = "hwy")) %>%  hc_yAxis(plotBands = list(list( from = 20,  to = 30,  color = "rgba(119, 119, 119, 0.2)",   label = list(text = "参考区域"))))

参考标识_点标识

有时，我们需要特殊标明某个点的值或者对某个点的情况进行特殊的说明，则需要对该点进行标识，hc_annotations可实现相应的功能，具体的设置情况和参数说明见代码，在highcharter中进行该设置相对比较复杂，参数较多，需要多熟悉和多调整。

highchart() %>%  hc_xAxis(categories = citytemp$month) %>%  
hc_add_series(name = "Tokyo", data = citytemp$tokyo) %>%  
 hc_annotations(   
       list(   
         #标记框设置      
        labelOptions = list(        
        #背景颜色
        backgroundColor = "rgba(255,255,255,0.5)",       
     #标记框位置调整        
     verticalAlign = "top", 
     y = 15,x=20  ),             
labels = list(  
 list(    
#被标记的数点          
point = list(  x = 2,  
           y = 9.5,
           xAxis = 0,  
          yAxis = 0 ), 
         text = "point one"  ),   list(  
        point = list(  
          x = 5,    
         y = 21.5,    
        xAxis = 0,    
        yAxis = 0   ),  
        text = "point two" ) ) )  )

图表标题

图表标题通过hc_title进行设置，如果图表需要子标题，则通过hc_subtitle。其中的主要参数如下：
text:标题文字
align:标题位置（left、center、right）
style:标题格式（color【标题颜色】,fontSize 【文字大小】）

hchart(mpg,"scatter", hcaes(x = "displ", y = "hwy",group = "class")) %>%  
 hc_title(text= "这是图表标题", align='center',style = list(color="#AB36BC",fontSize = "30px")) %>%  
 hc_subtitle(text= "这是副标题", align='center')

图表图例

图例设置包：enabled（是否显示图例） title(图例标题) 图例位置（align） floating（是否浮动：图例是否在图内） layout（垂直[vertical]或水平[horizontal]摆放） x;y（图例的相对位置）
这些设置均在hc_legend中进行，通过调整参数的值，得到合理的图例布局。

hchart(mpg,"scatter", hcaes(x = "displ", y = "hwy",group = "class")) %>%  
hc_legend( 
          #图例标题  
          title = list(text = "图例"),   
         #图例是否显示  
          enabled = TRUE,   
         #图例布局位置   
         align = "right",  
         verticalAlign = "top",   
         #是否浮动：图例是否在图内  
         floating = TRUE,  
         #垂直或水平摆放  
         layout = "vertical", 
         #图例的相对位置
         x = -100, y = 50)

图表颜色

大多数情况下，默认颜色都不太合适，需要我们自己进行设置调整，在highcharter中进行颜色是通过 colors 来指定的，colors 是个颜色值向量，默认是：colors = c'#7cb5ec', '#434348', '#90ed7d', '#f7a35c', '#8085e9', '#f15c80', '#e4d354', '#8085e8', '#8d4653', '#91e8e1')，一共10个默认颜色，我们可以修改颜色值或增加颜色个数来自定义图表数据列颜色，当所需颜色的数量超过colors的长度时，则会从头调用。

hchart(class_num, "column", hcaes(x = "class", y = "N")) %>%  
hc_plotOptions(column = list(  colorByPoint = TRUE,  colors = c('#058DC7', '#50B432', '#ED561B', '#DDDF00','#24CBE5', '#64E572', '#FF9655', '#FFF263', '#6AF9C4')))

图表主题

highcharter包提供了多个主题，可以根据实际需求和个人喜好进行选择使用，极大的减少对图表设置所花的时间，同时也能够让我们作出风格独特的可视化作品。hc_add_theme是进行主题设置的函数，其包括了一些知名媒体或公司的图表风格：
FiveThirtyEight : hc_theme_flat()
经济学人：hc_theme_economist()
金融时报：hc_theme_ft()
Google ：hc_theme_google()
Firefox ：hc_theme_ffx()

FiveThirtyEight

hchart(mpg,"scatter", hcaes(x = "displ", y = "hwy",group = "class")) %>%  hc_add_theme(hc_theme_538())

经济学人

hchart(mpg,"scatter", hcaes(x = "displ", y = "hwy",group = "class")) %>%  hc_add_theme(hc_theme_economist())

金融时报

hchart(mpg,"scatter", hcaes(x = "displ", y = "hwy",group = "class")) %>%  hc_add_theme(hc_theme_ft())

Google

hchart(mpg,"scatter", hcaes(x = "displ", y = "hwy",group = "class")) %>%  hc_add_theme(hc_theme_google())

Firefox

hchart(mpg,"scatter", hcaes(x = "displ", y = "hwy",group = "class")) %>%  hc_add_theme(hc_theme_ffx())

更多的图表主题可以参考http://jkunst.com/highcharter/themes.html

以上是本期介绍在R语言如何对使用highcharter包绘制的图表进行优化，后续将会介绍highcharter包中如何进行高级图表绘制！