可能有比这更简单的方法,但这是可行的。我已经用过这个包了htmlwidgets
, 此外plotly
.
我已将文本颜色的变化写为一个事件,因为替代方案是五个单独的痕迹,就像您在问题中回避的那样。
在 JS 中,我有一个 if-else 语句,它查询pointerNumber
。指针编号是标记、条形、线条的数量,无论您在绘图上有什么。在本例中,它是酒吧。
指针编号始终从零开始并且是连续的数字 - 不要假设顺序与可视化相匹配。 (我认为它遵循数据提供的顺序,但我从未觉得有必要对其进行调查,所以我并不是 100% 相信这一点。)
在此代码中,我将指针编号 0 更改为黑色文本(即浅粉色文本)。如果您觉得br
栏也应该有黑色文本,你可以修改if(pn === 0){
to if(pn === 0 || pn === 2) {
现在粉色旁边的栏也将有黑色文本。 (指针 1 恰好是最右边的列。)
事件代码:
hoverer = "function(el, x) {
el.on('plotly_hover', function(d){
var pn = d.points[0].pointNumber;
var fon = [];
var hov = [];
if(pn === 0){
col = 'black';
} else {
col = 'white'};
fon = {
'family': 'DM Sans',
'size': 15,
'color': col};
hov = {
'bordercolor': 'transparent',
'font': fon};
h = {hoverlabel: hov};
Plotly.restyle(el.id, h);
});}"
这是在图表中使用它的方式:
df2 %>%
plot_ly(x = ~key,
y = ~value,
type = 'bar',
color = ~value,
colors = c(rgb(0, 0, 0, 1), rgb(1, 0.85, 0.85, 1)),
stroke = I('black'),
span = I(1),
hoverinfo = 'text',
hovertext = ~paste0('value: ', value,
'\nkey: ', key)) %>%
layout(hoverlabel = list(bordercolor = 'transparent',
font = list(family = 'DM Sans',
size = 15,
color = 'white'))) %>%
htmlwidgets::onRender(hoverer) # this will trigger the event driven code