Comment faire une SVG de l'élément de texte “click-through-mesure”?

J'ai une carte SVG éléments de texte pour nommer les lieux. Je veux les emplacements (formes), pour être cliquable, et ils le sont, mais parce que les éléments de texte sont au-dessus d'eux, si quelqu'un passe sur un élément de texte, puis clique, rien ne se passe parce que la forme n'a pas été cliqué : l'élément de texte a été. Comment puis-je faire en sorte que si l'élément de texte est sélectionné, cliquez sur le passe "par" et à la forme ?

InformationsquelleAutor Cystack | 2012-10-16
  1. 51

    Mozilla introduit une propriété CSS pour cet effet appelé pointeur-événements. Il était à l'origine limité aux formes SVG, mais est désormais pris en charge sur la plupart des éléments du DOM dans les navigateurs modernes:

    span.label { pointer-events: none; }

    La réponse à cette question a quelques bonnes informations sur l'obtention du même résultat dans les vieux IE:

    css 'pointeur-événements" de la propriété alternative pour IE

    • COOL, ne savaient pas qu'il a travaillé avec SVG, seulement "régulier" éléments
    • le "pointeur-événements" de la propriété a été une partie de SVG depuis le début (et non, ce n'est pas introduit par Mozilla - si Mozilla n'pionnier de l'utilisation de cette propriété en dehors de svg). Comme le premier lien, il dit: "Avertissement: L'utilisation de pointeur-événements dans le CSS pour les non-éléments SVG est expérimental".
    • Downvoting lui juste pour c'est dire si 😉
    • Je ne pouvais pas obtenir stackLabels de ne pas voler les événements de la souris dans Highcharts, c'était la seule solution que j'ai pu obtenir pour travailler!
    InformationsquelleAutor Matt Stone
  2. 6

    ajouter cette css pour le texte:

    pointer-events: none;
    InformationsquelleAutor william malo
  3. 3

    Si il est possible de regrouper les formes de cartes avec le texte à l'intérieur d'un "<g>" élément, vous pouvez joindre le clic pour le groupe, plutôt que la forme. En faisant cela donne également l'avantage de transformations appliquées au groupe appliquera à la fois la forme et le texte. Si le regroupement n'est pas possible, alors je suis d'accord la réponse précédente est certainement votre meilleur coup. Essentiellement ce qui se passe, c'est ceci: la plupart des gens de visualiser un clic pénétrant à la baisse par le biais de votre z-index, mais il ne fonctionne pas de cette façon. Cliquez sur les bulles dans les DOM, donc, si le texte ne traite pas de clic, il se propage jusqu'à la prochaine élément du DOM qui est la société mère du groupe ou du conteneur. Cela continue jusqu'à ce qu'il atteigne le premier élément du DOM.

    InformationsquelleAutor user2009125