|
目录
相关说明
代码
实现效果
进一步应用
完整代码
显示效果
相关说明
- 在echart源代码的基础上将语法对接R语言语法并在rstudio上运行，成为html报告中的一部分
- 在代码中添加注释和理解
- 进行举一反三的应用；原图为柱形图；也可以转化为条形图；
- 该图可应用于同时展示游戏商品两个时间段销售数据及两者的差距；实用性强
代码
library(devtools)
library(recharts)
library(rCharts)
option = list(
title =list(
text = '销售数据',
subtext = '纯属虚构'
),
tooltip = list(
trigger= 'axis',
formatter= JS("function (params){
return params[0].name + ' : '
+ (params[2].value - params[1].value > 0 ? '+' : '-')
+ params[0].value + '<br/>'
+ params[2].seriesName + ' : ' + params[2].value + '<br/>'
+ params[3].seriesName + ' : ' + params[3].value + '<br/>'
}")
),
toolbox= list(
show = TRUE,
feature = list(
mark = list(show= TRUE),
dataView = list(show= TRUE, readOnly= FALSE),
magicType = list(show= TRUE, type= c('line', 'bar')),
restore = list(show= TRUE),
saveAsImage = list(show= TRUE)
)
),
legend= list(
data=c('本周', '上周'),
selectedMode=FALSE
),
xAxis = list(
list(
type = 'category',
data = c('周一','周二','周三','周四','周五','周六','周日')
)
),
yAxis = list(
list(
type = 'value',
min = 200,
max = 450
)
),
series = list(
list(
name='本周',
type='line',
data=c(400, 374, 251, 300, 420, 400, 440)
),
list(
name='上周',
type='line',
symbol='none',
itemStyle=list(
normal=list(
lineStyle= list(
width=1,
type='dashed'
)
)
),
data=c(320, 332, 301, 334, 360, 330, 350)
),
list(
name='上周2',
type='bar',
stack= '1',
barWidth= 6,
itemStyle=list(
normal=list(
color='rgba(0,0,0,0)'#辅助列设置为透明颜色不显示
),
emphasis=list(
color='rgba(0,0,0,0)'
)
),
data=c(320, 332, 251, 300, 360, 330, 350)#辅助列的取数方式:取两个系列的最小值
),
list(
name='变化',
type='bar',
stack= '1',
data=list(
80, 42,
list(value = 50, itemStyle=list( normal=list(color='red'))),
list(value = 34, itemStyle=list( normal=list(color='red'))),
60, 70, 90
)
)
)
);
echart(option,width=1000,height=500)%>% # 设定图形的宽度和长度
setTheme('macarons', calculable=TRUE)
实现效果
- 有交互效果：指针指到处可现实具体数值；
- 工具箱有很大作用：可直接查看原始值；可变化图形类型；如线图和柱状图之间的转换
- 刚使用这个博客，不知道怎么直接将交互图放入博客中；只能截图；截图就没法显示交互效果；后续可研究一下；
标题进一步应用
- 若是x轴类型比较多，那就需要将x轴的信息在y轴以条形图形式展示比较好；
- 步骤：将x轴和y轴兑换；需要修改tooltip的代码；若没有修改，那么提示框的信息显示会出现混乱
提示框源代码：
tooltip = list(
trigger= 'axis',
formatter= JS("function (params){
return params[0].name + ' : '
+ (params[2].value - params[1].value > 0 ? '+' : '-')
+ params[0].value + '<br/>'
+ params[2].seriesName + ' : ' + params[2].value + '<br/>'
+ params[3].seriesName + ' : ' + params[3].value + '<br/>'
}")
)
修改后的提示框代码
tooltip = list(
trigger= 'axis',
formatter= JS("function (params){
return params[0].name + ' : '
+ (params[0].value - params[1].value > 0 ? '+' : '-')
+ params[3].value + '<br/>'
+ params[0].seriesName + ' : ' + params[0].value + '<br/>'
+ params[1].seriesName + ' : ' + params[1].value + '<br/>'
}") # 注意：纵轴和横轴交换之后, formatter里面的params位置需要重新填才能正确显示；
)
完整代码
option = list(
title =list(
text = '销售数据',
subtext = '纯属虚构'
),
tooltip = list(
trigger= 'axis',
formatter= JS("function (params){
return params[0].name + ' : '
+ (params[0].value - params[1].value > 0 ? '+' : '-')
+ params[3].value + '<br/>'
+ params[0].seriesName + ' : ' + params[0].value + '<br/>'
+ params[1].seriesName + ' : ' + params[1].value + '<br/>'
}") # 注意：纵轴和横轴交换之后, formatter里面的params位置需要重新填才能正确显示；
),
toolbox= list(
show = TRUE,
feature = list(
mark = list(show= TRUE),
dataView = list(show= TRUE, readOnly= FALSE),
magicType = list(show= TRUE, type= c('line', 'bar')),
restore = list(show= TRUE),
saveAsImage = list(show= TRUE)
)
),
legend= list(
data=c('本周', '上周'),
selectedMode=FALSE
),
yAxis = list(
list(
type = 'category',
data = c('周一','周二','周三','周四','周五','周六','周日')
)
),
xAxis = list(
list(
type = 'value',
min = 200,
max = 450
)
),
series = list(
list(
name='本周',
type='line',
data=c(400, 374, 251, 300, 420, 400, 440)
),
list(
name='上周',
type='line',
symbol='none',
itemStyle=list(
normal=list(
lineStyle= list(
width=1,
type='dashed'
)
)
),
data=c(320, 332, 301, 334, 360, 330, 350)
),
list(
name='上周2',
type='bar',
stack= '1',
barWidth= 6,
itemStyle=list(
normal=list(
color='rgba(0,0,0,0)'#辅助列设置为透明颜色不显示
),
emphasis=list(
color='rgba(0,0,0,0)'
)
),
data=c(320, 332, 251, 300, 360, 330, 350)#辅助列的取数方式:取两个系列的最小值
),
list(
name='变化',
type='bar',
stack= '1',
data=list(
80, 42,
list(value = 50, itemStyle=list( normal=list(color='red'))),
list(value = 34, itemStyle=list( normal=list(color='red'))),
60, 70, 90
)
)
)
);
echart(option,width=1000,height=500)%>% # 设定图形的宽度和长度
setTheme('macarons', calculable=TRUE)
显示效果
|
客服电话
APP下载
官方微信
请发表评论