[charts] Highlight doesn't work when series ID is a number #18415
Description
Highlight doesn't work when series ID is a number. This is because we use the series ID as a key in the series object here.
Keys in object cannot be numbers and will automatically be coerced to string:
Each property name is a string or a Symbol. Any other value, including a number, is coerced to a string. This outputs 'value', since 1 is coerced into '1'.
const a = { 1: 'a' };
console.log(a['1']); // aReproduction
Here.
The second series' ID is 1 instead of "1", so highlight doesn't work. If you change it to a string, then it works.
Screen.Recording.2025-06-17.at.17.42.02.mov
Alternatives
- Restrict series IDs to strings. This way, we can keep using objects for storing series. I think this might be best because
data-seriesdoesn't distinguish between strings and numbers, so we'll have issues there as well. - Use a
Mapto store series. This way, we can keep using numbers for keys, but it would break alluse*SeriesContextbecause it is exported and accessing maps using the bracket notation doesn't work.