web-dev-qa-db-fra.com

Interaction avec une info-bulle sur un graphique en courbes

Je conçois un graphique linéaire qui affiche une info-bulle lorsque l'utilisateur survole le graphique pour afficher des informations supplémentaires. Un exemple de travail de ce que j'utilise actuellement peut être vu ici .

Je m'intéresse aux modèles qui devraient être mieux suivis lors de l'interaction avec l'infobulle. Je suis particulièrement intéressé par les choix de conception suivants:

  • Si l'utilisateur peut survoler l'info-bulle avec sa souris.
  • La position verticale de l'info-bulle. Actuellement, j'utilise une position fixe dans la moitié supérieure du graphique.
  • Devrait-il y avoir un mécanisme pour garder l'infobulle visible après que l'utilisateur quitte la zone de graphique avec la souris, par exemple lorsque l'utilisateur souhaite toujours voir les données.

Tout autre paradigme d'interaction pour cela est également le bienvenu.

Une capture d'écran du graphique avec info-bulle: enter image description here

1
Pieter Meiresone

Les réponses à la plupart de vos questions ici dépendront probablement de ce que vous tracer, qui utilise votre graphique et comment ils l'utilisent (appareil).

Cependant, la première question a une réponse logique. L'utilisateur doit certainement pouvoir survoler l'info-bulle lorsque celle-ci contient un contenu exploitable. Par exemple, l'utilisateur doit être autorisé à placer sa souris sur l'info-bulle lorsqu'elle contient un lien sur lequel il peut cliquer.

Les positions fixes des info-bulles dépendront également de votre cas d'utilisation spécifique. La plupart des bibliothèques de graphiques attachent leurs info-bulles à l'endroit où se trouve votre curseur. Cela est particulièrement utile lorsque vous tracez des données avec de petites différences entre les points de données. Le déplacement dans l'info-bulle peut aider à rendre ces légères différences plus évidentes pour les utilisateurs.

Lorsqu'il s'agit de garder l'infobulle visible une fois que l'utilisateur a quitté la zone de graphique, cela dépendra également de votre graphique. Cependant, si une info-bulle reste pour toujours, n'est-ce pas plus une étiquette à ce stade? Si vous souhaitez qu'ils restent temporairement, vous pouvez envisager des info-bulles collantes. Voici une démonstration de leur fonctionnement (et vous pouvez généralement définir un délai d'expiration).

http://www.zingchart.com/playground/run/540e3ad9a9fae

Je fais partie de l'équipe ZingChart, donc si vous avez des questions sur la façon dont nous avons réalisé cette démo, n'hésitez pas à nous contacter.

3
Merrily