R语言echarts4r象形图按性别设置差异化颜色的技术问询

我编写了一个遍历数据框列表的函数，用于生成对比不同疾病男女风险率的象形图。例如，当女性风险率为男性的3.5倍时，需显示1个男性图标、3个完整女性图标及1个半填充女性图标。

当前使用echarts4r的代码仅能设置两种颜色（填充和背景），无法实现男性图标蓝色、女性图标粉色的差异化配色。尝试过添加colors列赋值，但e_color参数无法像symbol读取path那样识别该列；传入多种颜色时也仅会使用前两种。

现有代码片段 #

#save graphic as object to call
infograph <- new_df %>%
  #calling the genders into each graphic
  e_charts(gender) %>%
  
  e_x_axis(splitLine=list(show=FALSE),
           axisTick = list(show=FALSE),
           axisLine = list(show=FALSE),
           axisLabel = list(show=FALSE)) %>%
  
  e_y_axis(max = 100,
           splitLine=list(show=FALSE),
           axisTick=list(show=FALSE),
           axisLine=list(show=FALSE),
           axisLabel=list(show=FALSE)) %>%
  
  #colors of icon (fill and background)
  e_color(color=c('#69cce6', '#eee')) %>%
  
  #fill icon
  e_pictorial(value, symbol = path, z=10, name= 'realValue', 
              symbolBoundingData= 100, symbolClip= TRUE) %>% 
  #background icon
  e_pictorial(value, symbol = path, name= 'background', 
              symbolBoundingData= 100) %>%
  
  #currently show=FALSE, labels will hide
  e_labels(position='bottom', offset=c(0,10), show=FALSE,
           textStyle=list(fontSize=20, fontFamily = 'Arial',
                          fontWeight = 'bold',
                          color = '#69cce6'),
           formatter = "{@[1]}% {@[0]}") %>%
  #title of graph
  e_title(text = paste(unique(this$Disease), " Infographic", sep=""), left = "center") %>%
  #legend
  e_legend(show=FALSE) %>%
  #list exists online of themes to choose from
  e_theme("westeros")

测试数据框 #

new_df <- structure(list(gender = c("Male", "Female 1", "Female 2", "Female 3", "Female portional"),
                         value = c(100, 100, 100, 100, 65.6652360515021),
                         path = c("path://M20.822 18.096c-3.439-.794-6.64-1.49-5.09-4.418 4.72-8.912 1.251-13.678-3.732-13.678-5.082 0-8.464 4.949-3.732 13.678 1.597 2.945-1.725 3.641-5.09 4.418-3.073.71-3.188 2.236-3.178 4.904l.004 1h23.99l.004-.969c.012-2.688-.092-4.222-3.176-4.935z",
                                  "path://M20.822 19.307c-2.967-.681-6.578-2.437-5.514-4.723.684 1.126 2.801 1.777 4.45.804-4.747-1.204 2.334-9.471-3.871-14.105-1.135-.853-2.526-1.283-3.912-1.283-1.378 0-2.751.425-3.862 1.283-6.206 4.634.876 12.901-3.872 14.105 1.649.974 3.77.293 4.451-.804 1.064 2.286-2.551 4.043-5.514 4.723-2.978.682-3.178 2.466-3.178 4.004l.005.689h23.99l.005-.691c0-1.537-.2-3.32-3.178-4.002z",
                                  "path://M20.822 19.307c-2.967-.681-6.578-2.437-5.514-4.723.684 1.126 2.801 1.777 4.45.804-4.747-1.204 2.334-9.471-3.871-14.105-1.135-.853-2.526-1.283-3.912-1.283-1.378 0-2.751.425-3.862 1.283-6.206 4.634.876 12.901-3.872 14.105 1.649.974 3.77.293 4.451-.804 1.064 2.286-2.551 4.043-5.514 4.723-2.978.682-3.178 2.466-3.178 4.004l.005.689h23.99l.005-.691c0-1.537-.2-3.32-3.178-4.002z",
                                  "path://M20.822 19.307c-2.967-.681-6.578-2.437-5.514-4.723.684 1.126 2.801 1.777 4.45.804-4.747-1.204 2.334-9.471-3.871-14.105-1.135-.853-2.526-1.283-3.912-1.283-1.378 0-2.751.425-3.862 1.283-6.206 4.634.876 12.901-3.872 14.105 1.649.974 3.77.293 4.451-.804 1.064 2.286-2.551 4.043-5.514 4.723-2.978.682-3.178 2.466-3.178 4.004l.005.689h23.99l.005-.691c0-1.537-.2-3.32-3.178-4.002z",
                                  "path://M20.822 19.307c-2.967-.681-6.578-2.437-5.514-4.723.684 1.126 2.801 1.777 4.45.804-4.747-1.204 2.334-9.471-3.871-14.105-1.135-.853-2.526-1.283-3.912-1.283-1.378 0-2.751.425-3.862 1.283-6.206 4.634.876 12.901-3.872 14.105 1.649.974 3.77.293 4.451-.804 1.064 2.286-2.551 4.043-5.514 4.723-2.978.682-3.178 2.466-3.178 4.004l.005.689h23.99l.005-.691c0-1.537-.2-3.32-3.178-4.002z"),
                         fills = c("#69cce6", "hotpink", "hotpink", "hotpink", "hotpink")),
                    class = "data.frame", row.names = c(NA, -5L))

核心思路是通过独立系列设置颜色或动态读取数据列颜色实现男女图标差异化配色，以下提供两种可行方法：

方法1：按性别拆分系列绘制 #

将男性和女性数据拆分为独立系列，分别指定填充颜色，背景统一使用灰色：

library(dplyr)

infograph <- new_df %>%
  e_charts(gender) %>%
  
  e_x_axis(splitLine=list(show=FALSE),
           axisTick = list(show=FALSE),
           axisLine = list(show=FALSE),
           axisLabel = list(show=FALSE)) %>%
  
  e_y_axis(max = 100,
           splitLine=list(show=FALSE),
           axisTick=list(show=FALSE),
           axisLine=list(show=FALSE),
           axisLabel=list(show=FALSE)) %>%
  
  # 男性填充图标（蓝色）
  e_pictorial(value, symbol = path, z=10, name= 'male_real', 
              symbolBoundingData= 100, symbolClip= TRUE,
              data = filter(new_df, gender == "Male"),
              itemStyle = list(color = '#69cce6')) %>% 
  # 男性背景图标（灰色）
  e_pictorial(value, symbol = path, name= 'male_bg', 
              symbolBoundingData= 100,
              data = filter(new_df, gender == "Male"),
              itemStyle = list(color = '#eee')) %>%
  
  # 女性填充图标（粉色）
  e_pictorial(value, symbol = path, z=10, name= 'female_real', 
              symbolBoundingData= 100, symbolClip= TRUE,
              data = filter(new_df, grepl("Female", gender)),
              itemStyle = list(color = 'hotpink')) %>% 
  # 女性背景图标（灰色）
  e_pictorial(value, symbol = path, name= 'female_bg', 
              symbolBoundingData= 100,
              data = filter(new_df, grepl("Female", gender)),
              itemStyle = list(color = '#eee')) %>%
  
  e_labels(position='bottom', offset=c(0,10), show=FALSE,
           textStyle=list(fontSize=20, fontFamily = 'Arial',
                          fontWeight = 'bold'),
           formatter = "{@[1]}% {@[0]}") %>%
  e_title(text = paste(unique(this$Disease), " Infographic", sep=""), left = "center") %>%
  e_legend(show=FALSE) %>%
  e_theme("westeros")

方法2：动态读取数据框的fills列 #

利用JS函数动态读取数据中的fills列，为每个数据点绑定对应颜色，无需手动拆分系列：

infograph <- new_df %>%
  e_charts(gender) %>%
  
  e_x_axis(splitLine=list(show=FALSE),
           axisTick = list(show=FALSE),
           axisLine = list(show=FALSE),
           axisLabel = list(show=FALSE)) %>%
  
  e_y_axis(max = 100,
           splitLine=list(show=FALSE),
           axisTick=list(show=FALSE),
           axisLine=list(show=FALSE),
           axisLabel=list(show=FALSE)) %>%
  
  # 填充图标：动态读取fills列颜色
  e_pictorial(value, symbol = path, z=10, name= 'realValue', 
              symbolBoundingData= 100, symbolClip= TRUE,
              itemStyle = list(color = JS("function(params) { return params.data.fills; }"))) %>% 
  # 背景图标：统一灰色
  e_pictorial(value, symbol = path, name= 'background', 
              symbolBoundingData= 100,
              itemStyle = list(color = '#eee')) %>%
  
  e_labels(position='bottom', offset=c(0,10), show=FALSE,
           textStyle=list(fontSize=20, fontFamily = 'Arial',
                          fontWeight = 'bold'),
           formatter = "{@[1]}% {@[0]}") %>%
  e_title(text = paste(unique(this$Disease), " Infographic", sep=""), left = "center") %>%
  e_legend(show=FALSE) %>%
  e_theme("westeros")

说明 #

• 方法1适合需要明确分离男女系列的场景，逻辑清晰；
• 方法2更灵活，直接复用数据中的颜色配置，无需额外拆分；
• 修正了原代码中e_x_axis的拼写错误（spliLine→splitLine）；
• 背景图标统一使用灰色#eee，保证视觉一致性。

内容的提问来源于stack exchange，提问作者Kyle Schuck