如何禁用echarts4r中e_mark_line标签hover时的tooltip
解决echarts4r中markline标签悬停触发数据点tooltip的问题
我用echarts4r构建散点图时,添加了显示y轴平均值的markline,但鼠标悬停在markline的标签上时,会意外触发图表中某个数据点的tooltip,尝试多种方法都无法解决。复现代码如下:
library(dplyr) library(plyr) library(echarts4r) mydata <- data.frame(Sector_Description= c('Wood','Vehicle', 'Vegetables'), y = c(10, 8, 16), x = c(5,7, 3), tradevalue = c(316, 266, 356)) avg_y <- mean(mydata[,2]) mydata %>% e_charts(x) %>% e_scatter( y, tradevalue, label = list( show = TRUE, color = "black", fontSize = 10, position = "right", formatter = htmlwidgets::JS( "function(params){ return(params.data.sector.Sector_Description) }" ) ), labelLayout = list(hideOverlap = TRUE, dy = 0) ) %>% e_add_nested('sector', Sector_Description) |> e_tooltip( trigger= 'item',formatter = htmlwidgets::JS("function(params){ return( '<strong>Sector: </strong>' + params.data.sector.Sector_Description + '<br/><strong>X: </strong>' + (params.value[0]) + '<br/><strong>Y: </strong>' + (params.value[1]) ) } " ) ) %>% e_hide_grid_lines() %>% e_y_axis( axisLine = list(lineStyle = list(color = "#F0F0F0")), axisLabel = list(color = "#000000" ) ) %>% e_x_axis( axisLine = list(lineStyle = list(color = "#F0F0F0")), axisLabel = list(color = "#000000") ) %>% e_mark_line(symbol = "none",emphasis = list(disabled = TRUE), label = list(triggerTooltip = FALSE, color = "#000000",silient= FALSE), data = list(yAxis =avg_y ))
修正方案
问题根源有两点:
- 标签配置里的
silient是拼写错误,正确应为silent; - 仅设置标签的
triggerTooltip = FALSE不足以阻止事件传递,需要给markline本身添加silent = TRUE,彻底禁用其交互事件,避免触发下层散点的tooltip。
修改后的完整代码如下:
library(dplyr) library(plyr) library(echarts4r) mydata <- data.frame(Sector_Description= c('Wood','Vehicle', 'Vegetables'), y = c(10, 8, 16), x = c(5,7, 3), tradevalue = c(316, 266, 356)) avg_y <- mean(mydata[,2]) mydata %>% e_charts(x) %>% e_scatter( y, tradevalue, label = list( show = TRUE, color = "black", fontSize = 10, position = "right", formatter = htmlwidgets::JS( "function(params){ return(params.data.sector.Sector_Description) }" ) ), labelLayout = list(hideOverlap = TRUE, dy = 0) ) %>% e_add_nested('sector', Sector_Description) |> e_tooltip( trigger= 'item',formatter = htmlwidgets::JS("function(params){ return( '<strong>Sector: </strong>' + params.data.sector.Sector_Description + '<br/><strong>X: </strong>' + (params.value[0]) + '<br/><strong>Y: </strong>' + (params.value[1]) ) } " ) ) %>% e_hide_grid_lines() %>% e_y_axis( axisLine = list(lineStyle = list(color = "#F0F0F0")), axisLabel = list(color = "#000000" ) ) %>% e_x_axis( axisLine = list(lineStyle = list(color = "#F0F0F0")), axisLabel = list(color = "#000000") ) %>% e_mark_line( symbol = "none", emphasis = list(disabled = TRUE), silent = TRUE, # 新增:禁用markline的交互事件 label = list( triggerTooltip = FALSE, color = "#000000", silent = TRUE # 修正拼写错误 ), data = list(yAxis = avg_y ) )
修改后,鼠标悬停markline及其标签时,不会再触发数据点的tooltip,同时markline的平均值标签仍正常显示。
内容的提问来源于stack exchange,提问作者David Jolicoeur
相关产品推荐
相关产品推荐

