Echarts for R
Echarts:开源、画图、JavaScript、Web页面
R:开源
echarts4r的特点
- 语法简单、上手快
参考资料
Echarts官网:https://echarts.apache.org
echarts4r官网:https://echarts4r.john-coene.com
袁凡
2021年11月20日
Echarts:开源、画图、JavaScript、Web页面
R:开源
Echarts官网:https://echarts.apache.org
echarts4r官网:https://echarts4r.john-coene.com
自适应;横轴;纵轴–多个指标、双Y轴、堆叠、转置、反向、分组、时间轴
标题、图例、数据标签(格式化文本、富文本)、提示框(格式化文本)、标注点、标注线、标注区域、数据区域缩放、工具栏、视觉映射、自定义图形、排列组合、连接、嵌套
直角坐标系、极坐标系、单轴、日历、地理坐标系、平行坐标系
选择主题;背景颜色;
线:坐标轴轴线、坐标轴刻度线、坐标轴分割线、数据标签的视觉引导线;
文字:坐标轴标题、坐标轴标签、图表标题、图例、数据标签、提示框
|>换成%>% library(echarts4r) data |> e_charts(month) |> #横轴 e_bar(Evaporation) #纵轴 e_charts(data, month) |> #横轴 e_bar(Evaporation) #纵轴
## month Evaporation ## 1 1月 2.0 ## 2 2月 4.9 ## 3 3月 7.0 ## 4 4月 23.2 ## 5 5月 25.6 ## 6 6月 76.7
library(echarts4r) data |> e_charts(month) |> #横轴 e_bar(Evaporation) #纵轴 e_charts(data, month) |> #横轴 e_bar(Evaporation) #纵轴
data |>
e_charts(month) |> #横轴
e_bar(Evaporation) |> #纵轴
e_x_axis(
axisLabel = list(interval = 0, rotate = 30),
name = "X轴", #X轴的名字
formatter = '{value} 单位') #X轴标签的格式
data |>
e_charts(month) |> #横轴
e_bar(Evaporation) |> #纵轴
e_y_axis(
min = 0, #最小值
max = 200, #最大值
interval = 50, #间隔值
name = "Y轴", #轴名称
formatter = '{value} 单位' #轴标签
)
data |>
e_charts(month) |>
e_bar(Evaporation) |>
e_bar(Precipitation) |>
e_line(Temperature) |>
e_y_axis(
min = 0,
max = 200,
interval = 50,
name = "Y轴",
formatter = '{value} 单位')data |>
e_charts(month) |>
e_bar(Evaporation) |>
e_bar(Precipitation) |>
e_line(Temperature, y_index = 1) |>
e_y_axis(
min = 0,
max = 200,
interval = 50,
name = "主Y轴",
formatter = '{value}ml') |>
e_y_axis(
index = 1,
min = 0,
max = 28,
interval = 7,
name = "副Y轴",
formatter = '{value}°C')
data |>
e_charts(month) |>
e_bar(Evaporation, stack = "group1") |>
e_bar(Precipitation, stack = "group1") |>
e_y_axis(
min = 0,
max = 400,
interval = 50,
name = "Y轴",
formatter = '{value} 单位')data.new <- data |> dplyr::mutate(
Evaporation_rate =
round(Evaporation / (Evaporation + Precipitation), 2),
Precipitation_rate =
round(Precipitation / (Evaporation + Precipitation), 2))
data.new |>
e_charts(month) |> #横轴
e_bar(Evaporation_rate, stack = "group1") |> #纵轴
e_bar(Precipitation_rate, stack = "group1") |>
e_y_axis(
max = 1,
interval = 0.5,
formatter = e_axis_formatter("percent", digits = 1)) |>
e_tooltip(formatter = e_tooltip_item_formatter("percent"))
转置:交换横轴和纵轴
一般先按数值排序,也可按数据本身含义排序如人口金字塔
data.flip <- data[order(data$Evaporation), ] data.flip |> e_charts(month) |> e_bar(Evaporation) |> e_bar(Precipitation) |> e_flip_coords() #转置
data |>
e_charts(month) |>
e_bar(Evaporation) |>
e_bar(Precipitation, x_index = 1, y_index = 1) |>
e_y_axis(index = 0, min = 0, max = 200) |>
e_y_axis(
index = 1,
inverse = TRUE, #反向
min = 0,
max = 200)data.inverse <- data |> dplyr::mutate(Evaporation_i = -Evaporation) data.inverse |> e_charts(month) |> e_bar(Precipitation, stack = "group1", name = "男") |> e_bar(Evaporation_i, stack = "group1", name = "女") |> e_y_axis(show = FALSE) |> e_flip_coords()
## type month Evaporation Precipitation Temperature ## 1 A区域 1月 2.0 2.6 2.0 ## 2 A区域 2月 4.9 5.9 2.2 ## 13 B区域 1月 2.6 2.0 2.0 ## 14 B区域 2月 5.9 4.9 2.2
data.ab |> group_by(type) |> e_charts(month) |> e_line(Evaporation) |> e_toolbox_feature(feature = "dataView") |> e_toolbox_feature(feature="dataZoom")
time, value, category.data.ab |>
group_by(type) |>
e_charts(month, height=400, timeline = TRUE) |>
e_bar(Evaporation, name = "蒸发量") |>
e_bar(Precipitation, name = "降水量") |>
e_timeline_opts(axis_type = "category",
top = 5) |>
e_legend(bottom = 'bottom', orient = 'horizontal') |>
e_toolbox_feature(feature = "dataView")
## type month Evaporation Precipitation Temperature ## 1 A区域 1月 2.0 2.6 2.0 ## 2 A区域 2月 4.9 5.9 2.2 ## 13 B区域 1月 2.6 2.0 2.0 ## 14 B区域 2月 5.9 4.9 2.2
life.2 |>
group_by(Year) |>
e_charts(Income, timeline = TRUE) |>
e_scatter(
serie=Life_Expectancy,size = Population,bind = Country,
itemStyle = list(opacity = 0.8),)|>
e_timeline_opts(
autoPlay = TRUE,orient = 'vertical',inverse = TRUE,
right=0,top=20,bottom=20,width=55,symbol = 'none',
checkpointStyle = list(borderWidth = 2),
controlStyle = list(showNextBtn = FALSE,
showPrevBtn = FALSE)) |>
e_timeline_serie(
title = list(
list(
text = '各国人均寿命与GDP关系演变',
textStyle = list(fontWeight = 'normal',
fontSize = 20),
subtext = '1800',
subtextStyle = list(fontWeight = 'bold',
fontSize = 40)),
list(text='各国人均寿命与GDP关系演变',subtext = '1840'),
#省略部分
list(text='各国人均寿命与GDP关系演变',subtext = '2015')))
data |>
e_charts(month) |>
e_bar(Evaporation, name = "蒸发量") |>
e_bar(Precipitation, name = "降水量") |>
e_title("图表的主标题", "图表的副标题\n换行", left='center') |>
e_legend(right = 'right', orient = 'vertical') #右边,竖着
#上方正中间,竖着
#e_legend(top = 'top', orient = 'vertical')
#下方中间,横着
#e_legend(bottom = 'bottom', orient = 'horizontal')
#不显示图例
e_legend(show = FALSE) data |>
e_charts(month) |>
e_bar(Evaporation, name = "蒸发量") |>
e_bar(Precipitation, name = "降水量") |>
e_labels(
fontSize = 9,#标签字体大小
fontWeight = "bold",#字体粗细normal/bold/bolder/lighter
fontStyle = "normal", #字体风格normal/italic/oblique
fontFamily = "serif", #字体
position = "top", #标签位置
rotate = 30, #旋转角度
align = "middle", #水平对齐:left/middle/right
verticalAlign = "bottom", #垂直对齐:top/middle/bottom
color = "orange") #标签颜色
#字体:'sans-serif','monospace','Arial','Microsoft YaHei' ...
#'top'/'left'/'right'/'bottom'
#'inside'/'insideLeft'/'insideRight'
#'insideTop'/'insideBottom'
#'insideTopLeft'/'insideBottomLeft'
#'insideTopRight'/'insideBottomRight'\n换行data |>
e_charts(month) |>
e_bar(Evaporation, name = "蒸发量") |>
e_labels(formatter='{@[1]}:a')
## type month Evaporation Precipitation Temperature ## 1 A区域 1月 2.0 2.6 2.0 ## 2 A区域 2月 4.9 5.9 2.2 ## 3 A区域 3月 7.0 9.0 3.3 ## 4 A区域 4月 23.2 26.4 4.5 ## 5 A区域 5月 25.6 28.7 6.3 ## 6 A区域 6月 76.7 70.7 10.2
df.outer |>
e_chart(name) |>
e_pie(value, radius = c("20%", "40%")) |>
e_labels(
position="outside",
labelLine = list(length = 30),
formatter =
'{a|{a}}{abg|}\n{hr|}\n {b|{b}:}{c} {per|{d}%} ',
backgroundColor = '#F6F8FC',
borderColor = '#8C8D8E',
borderWidth = 1,
borderRadius = 4,
rich = list(
a = list(
color = '#6E7079', lineHeight = 22, align ='center'),
hr = list(
borderColor = '#8C8D8E', width = '100%',
borderWidth = 1, height = 0),
b = list(
color = '#4C5058', fontSize = 14,
fontWeight = 'bold', lineHeight = 33),
per = list(
color = '#fff', backgroundColor = '#4C5058',
padding = c (3, 4),borderRadius = 4)))|>
e_toolbox_feature(feature = "dataView")|>
e_legend(type = 'scroll', bottom = 'bottom')e_tooltip(trigger = "item") #数据项触发e_tooltip(trigger = "axis") #坐标轴触发data.ab |>
group_by(type) |>
e_charts(Evaporation) |>
e_scatter(Precipitation,
symbol_size = 10,
symbol = "circle") |>
e_x_axis(name = "蒸发量") |>
e_y_axis(name = "降水量") |>
e_tooltip(
trigger = "item",
formatter = htmlwidgets::JS(
"function(params){
return('指标:' +
'<br />降水量: ' + params.value[0] +
'<br />蒸发量: ' + params.value[1])}"))
data |>
e_charts(month) |>
e_bar(Evaporation, name = "蒸发量") |>
e_bar(Precipitation, name = "降水量") |>
e_mark_point("蒸发量", data = list(type = "min")) |>
e_mark_point("蒸发量", data = list(type = "max")) |>
e_mark_point("降水量",
data = list(type = "min",
symbol = "triangle")) |>
e_mark_point("降水量",
data = list(type = "max",
symbolSize = 80))
# 'circle', 'rect', 'roundRect', 'triangle',
# 'diamond', 'pin', 'arrow', 'none'min、max、averagedata |>
e_charts(month) |>
e_bar(Evaporation, name = "蒸发量") |>
e_bar(Precipitation, name = "降水量") |>
e_mark_line("蒸发量", data = list(type = "average")) |>
e_mark_line("降水量",
data = list(type = "average"), precision = 1) |>
e_mark_line("蒸发量", data = list(type = "max")) |>
e_tooltip(trigger = "axis")
data |>
e_charts(month) |>
e_bar(Evaporation, name = "蒸发量") |>
e_bar(Precipitation, name = "降水量") |>
e_mark_area(
serie = "蒸发量",
data = list(list(xAxis = "6月", yAxis = 100),
list(xAxis = "9月", yAxis = 180)),
itemStyle = list(color = "lightblue")) |>
e_mark_area(
serie = "降水量",
data = list(
list(xAxis = "min", yAxis = "min"),
list(xAxis = "max", yAxis = "average")),
itemStyle = list(color = "lightgreen")) |>
e_tooltip(trigger = "axis")group_by情况下的标注点-线-区域## height weight type ## 1: 161.2 51.6 Female ## 2: 174.0 65.6 Male
hw|>
group_by(type)|>
e_charts(height )|>
e_scatter(serie = weight,symbol_size = 10)|>
e_mark_area(
silent = TRUE,
itemStyle = list(
color = 'transparent',
borderWidth = 1, borderType = 'dashed'),
#serie = "Female",
data = list(
list(xAxis = "min", yAxis = "min"),
list(xAxis = "max", yAxis = "max"))) |>
e_mark_point(data = list(type = 'min')) |>
e_mark_point(data = list(type = 'max')) |>
e_mark_line(data = list(type = 'average'),
lineStyle = list(type = 'solid')) |>
e_mark_line(serie = 'Female',
data = list(xAxis = 160)) |>
e_mark_line(serie = 'Male',
data = list(xAxis = 170))
data |>
e_charts(month) |>
e_line(Evaporation, name = "蒸发量") |>
e_line(Precipitation, name = "降水量")|>
e_datazoom(x_index = 0,
start = 80,
end = 100) |>
e_datazoom(y_index = 0)
e_datazoom(y_index = 0, type = 'slider')e_datazoom(y_index = 0, type = 'inside')saveAsImage、brush、restore、dataView、dataZoom、magicTypee_brush()e_toolbox_feature(feature = "dataView")iris |>
e_charts(Sepal.Length) |>
e_scatter(Petal.Length, Sepal.Width) |>
e_visual_map(Sepal.Width,
scale = e_scale,
dimension=3) |>
e_tooltip(trigger = "axis")data |>
e_charts(month) |>
e_bar(Evaporation, name = "蒸发量") |>
e_bar(Precipitation, name = "降水量") |>
e_text_g(
left = "center",
top = 40,
z = -1000,
style = list(text = "自定义的文字\n自定义的文字\n自定义的文字",
fontSize = 12))
# e_draft(text="水印")
# e_image_g(
# right = 20,
# top = 20,
# z = -999,
# style = list(
# image = "https://www.r-project.org/logo/Rlogo.png",
# width = 150,
# height = 150,
# opacity = .6 ))
e1 <- data |>
e_charts(month,height = 250) |>
e_bar(Evaporation, name = "蒸发量")
e2 <- data |>
e_charts(month,height = 250) |>
e_line(Precipitation, name = "降水量")
liquid <- data.frame(val = c(0.6, 0.5, 0.4))
e3 <- liquid |>
e_charts(height = 250) |>
e_liquid(val)
funnel <-
data.frame(stage = c("View", "Click", "Purchase"),
value = c(80, 30, 20))
e4 <- funnel |>
e_charts(height = 250) |>
e_funnel(value, stage) |>
e_legend(show = FALSE)
e_arrange(e1, e2, e3, e4, cols = 2, rows = 2)
e_connect函数时需要在要连接的图中设定参数elementIde1 <- data |>
e_charts(month,
height = 200 , elementId = "图1") |>
e_bar(Evaporation, name = "蒸发量")
e2 <- data |>
e_charts(month,
height = 200 , elementId = "图2") |>
e_bar(Precipitation, name = "降水量")
e3 <- data |>
e_charts(month,
height = 200) |>
e_line(Temperature, name = "平均温度") |>
e_connect(c("图1", "图2"))
e_arrange(e1, e2, e3)
funnel <- data.frame(
stage = c("View", "Click", "Purchase"),
value = c(80, 30, 20),
color = c("blue", "red", "green"))
funnel |>
dplyr::mutate(show = TRUE, fontSize = c(15, 10, 5)) |>
e_charts() |>
e_funnel(value, stage) |>
e_add("label", show, fontSize) |>
e_add("itemStyle", color) |>
e_labels(position = "outside",
formatter = "{b} : {c}") |>
e_tooltip()
#e_add_nested/e_add_unnested data |>
e_charts(month) |>
e_line(Evaporation, name = "蒸发量") |>
e_line(Precipitation,
name = "降水量",
x_index = 1,
y_index = 1) |>
e_grid(height = "35%") |>
e_grid(height = "35%", top = "60%") |>
e_y_axis(
gridIndex = 1,
name = "主Y轴", #坐标轴名称
nameLocation = "center", #坐标轴名称的位置
nameGap = 30) |>
e_x_axis(gridIndex = 1,
name = "主X轴",
nameLocation = "end") |>
e_y_axis(
index = 1,
name = '次Y轴',
nameLocation = "center",
nameGap = 15) |> #坐标轴名称与轴线之间的距离
e_x_axis(index = 1,
name = "次X轴",
nameLocation = "end")
data |>
e_charts(month) |>
e_line(Evaporation, name = "蒸发量") |>
e_line(Precipitation,
name = "降水量",
x_index = 1 ,
y_index = 1) |>
e_grid(width = "30%") |>
e_grid(width = "30%", left = "50%") |>
e_y_axis(gridIndex = 1) |>
e_x_axis(gridIndex = 1)
e_angle_axis为角度轴,即被折起来的轴,e_radius_axis为径向(半径)轴data|>
e_charts(month) |>
e_polar() |>
e_angle_axis(month) |>
e_radius_axis() |>
e_bar(Evaporation, name = "蒸发量",
coord_system = "polar") |>
e_line(Precipitation, name = "降水量",
coord_system = "polar")
e_angle_axis为角度轴,即被折起来的轴,e_radius_axis为径向(半径)轴data |>
e_charts(month) |>
e_polar() |>
e_angle_axis() |>
e_radius_axis(month, axisLabel = list(interval = 0)) |>
e_bar(Evaporation,
name = "蒸发量",
coord_system = "polar",
stack = "堆一堆") |>
e_bar(
Precipitation,
name = "降水量",
coord_system = "polar",
stack = "堆一堆") data |>
e_charts(month) |>
e_radar(Evaporation,
max = 200, #最大值
name = "蒸发量") |>
e_radar(Precipitation,
max = 200, #最大值
name = "降水量") |>
e_radar_opts(splitNumber = 4,
#指示器轴的分割段数
shape = "polygon",
#类型,还可以是circle
radius = "60%") |> #半径
e_tooltip(trigger = "item")data |>
e_charts(month, height=100) |>
e_single_axis(bottom = 20) |>
e_scatter(Evaporation,
name = "蒸发量",
Temperature,
coord_system = "singleAxis")
#e_scatter(value,size,coord_system = "singleAxis")e1 <- data.2 |>
#`height = 100`用来设置图形高度
e_charts(hours, height = 100) |> #横轴
#`bottom = 20`用来设置single组件距离容器下侧的距离
#`left=150`用来设置single组件距离容器左侧的距离
#`axisLabel=list(interval=2)`用来限定single组件单轴的显示间隔
e_single_axis(bottom = 20, left=100,
axisLabel=list(interval=2)) |>
e_scatter(Saturday_value, #纵轴
Saturday_size, #气泡大小
#写入JavaScript语言的缩放函数
scale_js = 'function (dataItem)
{return dataItem[2] * 4;}',
color = "#5470c6", #气泡颜色
coord_system = "singleAxis") |>
e_legend(show = FALSE) |>
e_title("Saturday", left = "left", top='middle')
e_arrange(e1, e2, e3, e4, e5, cols = 1) dates <-
seq.Date(as.Date("2021-09-01"),
as.Date("2021-10-31"), by = "day")
values <- rnorm(length(dates), 20, 6)
year <- data.frame(date = dates, values = values)
#左图
year |>
e_charts(date) |>
e_calendar(range = "2021-09",
orient = 'vertical') |>
e_heatmap(values, coord_system = "calendar") |>
e_visual_map(max = 30)
#右图
year |>
e_charts(date) |>
e_calendar(range = c("2021-09", "2021-11"),
orient = 'horizontal') |>
e_heatmap(values, coord_system = "calendar") |>
e_visual_map(max = 30) # install.packages("remotes")
# remotes::install_github('JohnCoene/echarts4r.maps')
library(echarts4r.maps)
df <- data.frame(region = c("湖北", "浙江", "北京", "广东"),
value = c(1, 2, 3, 4))
df |>
e_charts(region) |>
em_map("China") |>
e_map(value, map = "China") |>
e_visual_map(value) |>
e_theme("infographic")# data("cities")
# cc <- cities |> filter(country == "CN")
lines |>
e_charts() |>
e_geo(map = "China") |>
e_lines(
source_lon, source_lat, target_lon, target_lat,
source_name, target_name, cnt,
coord_system = "geo", #地理坐标系
name = "线的名字",
lineStyle = list(normal = list(
curveness = 0.3, #线的弯曲度
color = "red",
width = 2))) |>
e_tooltip(
trigger = "item",
formatter = htmlwidgets::JS(
"function(params){
return(
params.seriesName +'<br />' +
params.data.source_name + ' -> ' +
params.data.target_name + ':'+ params.value)}"))|>
e_toolbox_feature(feature = c("dataView", "saveAsImage"))group_by(type)没起作用parallel |>
group_by(type) |>
e_charts() |>
e_parallel(date,
AQIindex,
PM25,
PM10,
CO,
NO2,
SO2 ,
level,
opts = list(smooth = FALSE)) |>
e_legend(show = TRUE)|>
e_toolbox_feature(feature = "dataView")symbol = c("none", "arrow")表示只在轴线末端显示箭头,默认symbol=“none”即不显示箭头,symbol=“arrow”即两端都显示箭头symbolSize = c(20, 15)箭头的大小,第一个数字表示宽度(垂直坐标轴方向),第二个数字表示高度(平行坐标轴方向)data |> e_charts(month) |>
e_bar(Evaporation, name = "蒸发量") |>
e_y_axis(name = "Y轴",
axisLine = list(
show = TRUE, # 显示坐标轴轴线
symbol = c("none", "arrow") ,
symbolSize = c(20, 15),
lineStyle = list(
color = "red", #轴线的颜色
width = 2, #轴线的线宽
type = "dashed", #solid实线,dashed虚线,dotted点线
opacity = 0.5))) #轴线的透明度
alignWithLabel = TRUE 使刻度线和标签对齐,在boundaryGap=true 的时候有效data |>
e_charts(month) |>
e_bar(Evaporation, name = "蒸发量") |>
e_y_axis(
name = "Y轴",
axisLine = list(show = TRUE),
axisTick = list(
show = TRUE, #显示坐标轴刻度
inside = TRUE, #刻度朝内,默认朝外
length = 10, #刻度的长度
lineStyle = list(
color = "red", #刻度线的颜色
width = 5, #刻度线的线宽
type = "solid", #刻度线的类型
opacity = 0.5 #刻度线的透明度
))) |>
e_x_axis(boundaryGap = TRUE,
axisTick = list(alignWithLabel = TRUE))
data |>
e_charts(month) |>
e_bar(Evaporation, name = "蒸发量") |>
e_bar(Precipitation, name = "降水量") |>
e_y_axis(
name = "Y轴",
axisLine = list(show = TRUE),
splitLine = list(
show = TRUE, #显示坐标轴分割线
lineStyle = list(
color = "red", #分割线的颜色
width = 2, #分割线的线宽
type = "dashed", #分割线的类型
opacity = 0.5 #分割线的透明度
))) |>
e_x_axis(
splitLine = list(
show = TRUE, #显示坐标轴分割线
interval = 1, #坐标轴分隔线的显示间隔
lineStyle = list(
color = "red", #分割线的颜色
width = 2, #分割线的线宽
type = "dashed", #分割线的类型
opacity = 0.5))) #分割线的透明度
maxSurfaceAngle设置为小于 90 度的值保证引导线不会和扇区交叉。labelLine()通过设置lineStyle=list()改变引导线的颜色、线宽、类型、透明度等等属性。data |>
e_charts(month) |>
e_pie(Evaporation,
name = "蒸发量",
radius = "40%") |>
e_labels(
position = "outside", #显示视觉引导线
fontSize = 9,
alignTo = "edge",
formatter = "名称:{b} \n 值:{c} 单位",
minMargin = 5,
edgeDistance = 10, #文字边距
lineHeight = 15, #行高
distanceToLabelLine = 5, #文字与引导线之间的距离
labelLine = list(
length = 20, #引导线第一段的长度
length2 = 0, #引导线第二段的长度
maxSurfaceAngle = 80)) |>
e_legend(type = "scroll")data |>
e_charts(month, height = 400) |>
e_bar(Evaporation, name = "蒸发量") |>
e_line(Precipitation, name = "降水量", color="red") |>
e_x_axis(
name = "X轴的名称", nameLocation="center",
nameTextStyle = list(color = "red"), #修改坐标轴标题的文字属性
axisLabel = list(color = "orange")) |> #修改坐标轴标签的文字属性
e_y_axis(
name = "Y轴的名称",
nameTextStyle = list(color = "red"), #修改坐标轴标题的文字属性
axisLabel = list(color = "orange")) |> #修改坐标轴标签的文字属性
e_title(text = "主标题",
textStyle = list(color = "lightblue")) |> #修改图表标题的文字属性
e_legend(
textStyle = list(color = "lightgreen"), #修改图例的文字属性
itemStyle = list(color = "grey"), #修改图例的图形属性
lineStyle = list(color = "red"))|> #修改图例的图形中线的属性
e_labels(show = TRUE, position = "top",
color = "green") |> #修改数据标签的文字属性
e_tooltip(show = TRUE, trigger = "axis",
textStyle = list(color = "pink")) #修改提示框中的文字属性
data |>
e_charts(month, height = 400) |>
e_bar(Evaporation, name = "蒸发量") |>
e_x_axis(
name = "X轴\n的名称", #支持`\n`换行
nameLocation = "center",
nameGap = 45,
nameTextStyle = list(
color = "red", #颜色
fontStyle = "normal", #字体风格,还有italic/oblique
fontWeight = "bolder", #字体粗细,还有normal/bold/lighter
fontFamily = "Microsoft YaHei", #字体系列
fontSize = 12, #字体大小
align = "center", #字体水平对齐方式,还有left/right
verticalAlign = "middle", #字体垂直对齐方式,还有top/bottom
lineHeight = 20, #字体行高,默认56
backgroundColor = "grey", #字块背景颜色
borderColor = "blue", #文字块边框颜色
borderWidth = 2, #文字块边框宽度
borderType = "dashed" #文字块边框描边类型
))data |>
e_charts(month, height = 400) |>
e_bar(Evaporation, name = "蒸发量") |>
e_x_axis(
name = "X轴的名称", nameLocation = "center", nameGap = 45,
nameTextStyle = list(
backgroundColor = "lightgrey", #字块背景颜色
borderRadius = 20, #文字块的圆角
padding = c(1, 2, 3, 6), #文字块的内边距,(上,右,下,左)
shadowColor = "red", #文字块背景阴影颜色
shadowBlur = 2, #文字块背景阴影长度
shadowOffsetX = 1, #文字块背景阴影X偏移
shadowOffsetY = 1, #文字块背景阴影Y偏移
width = 20, #文字本身的显示宽度
height = 10, #文字本身的显示高度
textBorderColor = "blue", #文字本身的描边颜色
textBorderWidth = 0.2, #文字本身的描边宽度
textBorderType = "solid", #文字本身的描边类型
textBorderDahOffset = 0)) #文字本身虚线描边时的偏移量
#textShadowColor文字本身的阴影颜色/textShadowBlur文字本身的阴影长度
#testShadowOffsetX文字本身的阴影X偏移/testShadowOffsetY文字本身的阴影Y偏移
#文字超出宽度是否截断或换行:overflow
https://echarts.apache.org/zh/option.html#xAxis.nameTextStyle.overflowe_charts(data, month) |>
e_bar(Evaporation, name = "蒸发量") |>
e_bar(Precipitation, name = "降水量") |>
e_line(Temperature, name = "平均温度", y_index = 1) |>
e_x_axis(axisLabel = list(interval = 0))|>
e_y_axis(
min = 0, max = 250, interval = 50,
name = "水量", formatter = '{value} ml',
axisLine = list(show = TRUE),
axisTick = list(show = TRUE, inside = TRUE)) |>
e_y_axis(
index = 1, min = 0, max = 25, interval = 5,
name = "温度", formatter = '{value} °C') |>
e_title('图表的主标题') |>
e_tooltip(trigger = "axis") |>
e_legend(bottom = 'bottom', orient = 'horizontal') |>
e_labels(fontSize = 9, position = "top") |>
e_datazoom(y_index = 1, type = "inside") |>
e_mark_point("平均温度", data = list(type = "min")) |>
e_mark_point("平均温度", data = list(type = "max")) |>
e_mark_line("平均温度", data = list(type = "average")) |>
e_mark_area(
serie = "蒸发量",
data = list(list(xAxis = "6月", yAxis = 100),
list(xAxis = "9月", yAxis = 180)),
itemStyle = list(color = "lightblue")) |>
e_toolbox_feature(feature = c("dataView", "brush")) xAxis: [
{
type: 'category',
axisTick: { show: false },
nameTextStyle: { padding: [3, 4, 5, 6] }
}
]
visualMap: [
{
show: false,
dimension: 3,
categories: data.counties,
inRange: {
color: (function () {
// prettier-ignore
var colors = ['#51689b', '#ce5c5c'];
return colors.concat(colors);
})()
}
}
]
e_x_axis(
type = "category",
axisTick = list(show = TRUE),
nameTextStyle = list(
padding = c(1, 1, 5, 6)
)
)
e_visual_map(
show = FALSE,
dimension = 3,
categories = c(
'Australia','Canada','China','Cuba','Finland','France',
···
'United States'),
inRange = list(
color = htmlwidgets::JS(
"(function () {
// prettier-ignore
var colors = ['#51689b', '#ce5c5c'];
return colors.concat(colors);
})()"
)
))