Setting hoverlabel bordercolor to transparent causes text to also be transparent

A trace set with bordercolor: transparent (or actually any colour) causes font color on hoverlabels to also be transparent (or that colour). As a user this is unexpected behaviour for setting just a bordercolor.

var trace1 = {
  x: [1, 2, 3, 4], 
  y: [16, 5, 11, 9], 
  type: 'scatter',
  hoverlabel: {
    bordercolor: "transparent",
  }
};

https://codepen.io/dsmmcken/pen/GYRVrK

[dsmmcken]

I don’t think that’s the fix. I would do:

https://github.com/plotly/plotly.js/blob/9772ef6dd5ec5417ab50dd378aaa536a8c845336/src/components/fx/hover.js#L90-L97

description should be changed to defaults to contrasting colour, same as borderColor description. This appears to be an intentional decision, but I can’t figure out why one would want it to behave that way. I would suggest instead making both font colour and border colour both independently default to a contrast colour, rather than contrastColor defaulting to borderColor if set and re-used on fontColor.

remove borderColor as part of the default for contrastColor, here: https://github.com/plotly/plotly.js/blob/9772ef6dd5ec5417ab50dd378aaa536a8c845336/src/components/fx/hover.js#L899

no change, just relevant that contrastColor is used on font (which is defaulting to borderColor if set): https://github.com/plotly/plotly.js/blob/9772ef6dd5ec5417ab50dd378aaa536a8c845336/src/components/fx/hover.js#L954

add d.borderColor to here d.borderColor || contrastColor, here: https://github.com/plotly/plotly.js/blob/9772ef6dd5ec5417ab50dd378aaa536a8c845336/src/components/fx/hover.js#L983

That way they are independent of each other, and both default to contrastColor if neither, or one, is set… I think, didn’t fully read this.

That behaviour would be more inline with what I would expect.

[alexcjohnson]

Thanks @EsdrasXavier - FWIW that code is here in the source:

https://github.com/plotly/plotly.js/blob/9772ef6dd5ec5417ab50dd378aaa536a8c845336/src/components/fx/calc.js#L37-L44