[BUG]: Coupled hoverinfo tooltips are misaligned
Personne n'a encore pris cette issue.
- Langage dominant
- JavaScript
- Étoiles
- 18.3k
- Forks
- 2k
- Merge moyen
- 2 j 12 h
- PR mergées (30 j)
- 28
Description
Description
I have setup a coupled hover effect for two adjacent heatmaps using Fx.hover. As shown in the Gif below, the two hoverinfo boxes don't align. Technically, their arrows do point to the same locations in their respective heatmaps, but the left arrow points sharply upward and the right arrow points sharply downward. I think this makes the visualisation harder to interpret.
Screenshots/Video
This Gif shows the misaligned hoverinfo boxes.
This screenshot shows the misalignment. I have drawn on the blue line for clarity. Note how the left tooltip is below the point, with its arrow pointing upwards, while the right tooltip is above the point, with its arrow pointing downwards. I feel like the tooltips should match one another and be aligned.
These are the arrows that I get when the coupled hover effect is active.
These are the 'standard' arrows that I get when the coupled hover effect is inactive. By this, I mean when I have commented-out the JavaScript that calls Fx.hover to update the tooltips. I would prefer if both tooltips had this style of arrow at all times, except for when the alternative style of arrow is really necessary.
Steps to reproduce
I have attached two files. The Python file creates the plot and then injects the JS file, which handles the coupled hover interaction. Running the Python file creates an output.html file, which you can open in a browser and see the results shown above.
demo.js (~15 lines)
demo.py (~30 lines)
Notes
I considered hiding the tooltip arrows as in #7278 but that would make the issue worse, since the tooltip boxes do not line up with each other.
Guide de contribution
Ouvrir le guide de contribution
Par où commencer
- Lisez l'issue en entier, puis le guide de contribution du projet.
- Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
- Forkez le dépôt et travaillez sur une branche.
- Ouvrez une pull request qui référence le numéro de l'issue.
Piste de recherche
Exécutez le demo.py fourni pour générer output.html, puis examinez demo.js et l’interaction Fx.hover couplée dans le navigateur. Comparez les positions des infobulles et les directions des flèches pour les deux cartes thermiques adjacentes ; la tâche est terminée lorsque les infobulles de survol couplées sont alignées de manière cohérente tout en préservant le comportement standard des flèches lorsque cela est approprié.
Rédigé par le modèle d'indexation à partir du texte de l'issue.
Évaluation
- Stack technique
- javascript
- Domaine
- data-visualization
- Type d'issue
- Bug
- Difficulté
- 3/5
- Temps estimé
- 1-2 jours
- Activité
- À l'abandon
- Clarté
- Plutôt claire
- Accessibilité débutants
- 45/100