web-dev-qa-db-fra.com

Scintillement dans l'infobulle de Google Charts

Lorsque vous utilisez Google Charts, l'info-bulle apparaît parfois derrière le pointeur de la souris, ce qui provoque un scintillement, même un petit peu.

Est-ce un problème connu?

 enter image description here

javascriptgoogle-visualization
25
Arnaud

Oui, c'est un petit bug.

Vous devez seulement ajouter ceci à votre CSS:

svg > g > g:last-child { pointer-events: none }
83
NetVicious

Oui, il semble que le scintillement est une question ouverte. 

https://github.com/google/google-visualization-issues/issues/2162

11
David Bradshaw

Ça marche dans mon cas

svg > g:last-child > g:last-child { pointer-events: none }
div.google-visualization-tooltip { pointer-events: none }
5
user2960190

Oui, vous avez raison, l'info-bulle recouvre la zone de déclenchement, ce qui entraîne sa disparition, ce qui à son tour ouvre la zone de déclenchement et l'affiche à nouveau, etc., etc. 

Je l'ai résolu en ciblant le conteneur d'info-bulles via CSS et en remplaçant le code CSS de Google de la manière suivante:

div.google-visualization-tooltip {

    padding: 0 !important;
    margin: 0 !important;
    border:none !important;
    box-shadow: unset !important;
    background-color: rgba(0,0,0,0) !important;
    height:auto !important;
    overflow:hidden !important;

}

Cela devrait afficher votre info-bulle HTML à environ 1 m du pointeur de la souris et vous permettre également de vous débarrasser de la boîte blanche laide originale. A travaillé pour moi dans Calendar Chart . Si cela ne fonctionne pas dans votre cas, vous devez connaître le nom de classe du conteneur d'info-bulle de votre graphique.

Je pense que la racine du problème est que l'info-bulle est affichée trop près du pointeur, mais si vous supprimez la marge et le remplissage de ce conteneur, cela le corrige en quelque sorte.

J'espère que cela fonctionne pour vous.

0
Pavel Lebedeff