IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

HTML Discussion :

[SVG] Déplacer un texte sur Path


Sujet :

HTML

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre éclairé
    Inscrit en
    Septembre 2008
    Messages
    629
    Détails du profil
    Informations forums :
    Inscription : Septembre 2008
    Messages : 629
    Par défaut [SVG] Déplacer un texte sur Path
    Bonjour,

    J'ai un texte sur mes Path est pour cela j’utilise se code:

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    <tspan x="-10" y="3" class="textex">1</tspan><tspan x="0" y="3" class="textex" dy="-1ex">ére </tspan><tspan x="50" y="85" class="texte">Circonscription</tspan></text>
    Mon problème il est que lorsque je doit déplacer mon texte sur mon Path je suis obliger de jouer avec les x et y et j'ai trois fois les x et y.

    Peut-on pas les grouper pour en avoir un seul

    Je joint un fichier exemple.

    Merci d'avance

    Max
    Fichiers attachés Fichiers attachés

  2. #2
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 211
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 211
    Par défaut
    Bonjour,
    tu attends une réponse alors que tu n'as même pas daigné répondre à ta discussion : Modifier mon code onMouseOver !

  3. #3
    Membre éclairé
    Inscrit en
    Septembre 2008
    Messages
    629
    Détails du profil
    Informations forums :
    Inscription : Septembre 2008
    Messages : 629
    Par défaut
    Bonjour NoSmoking,

    Toutes mes excuses. La j’étais un peut larguer je n'arrivais plus à suivre, vraiment désoler.

    Max

  4. #4
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 211
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 211
    Par défaut
    Il te faut du bons sens
    1/ positionner le texte avec <text transform=""> et ensuite
    2/ positionner tes parties de texte <tspan x="30" y="-20"> en utilisant les attribut dx et dy.

    Si les choses sont bien faites le premier <tspan> ne devrait pas avoir de x/y.
    Exemple d'un de tes textes
    Code svg : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    <text transform="matrix(1.0058 0 0 1 226.4536 393.0449)" >
        <tspan>16</tspan>
        <tspan dy="-1ex">éme</tspan>
    </text>

    PS : merci de penser à faire un retour sur ton autre discussion.

  5. #5
    Membre éclairé
    Inscrit en
    Septembre 2008
    Messages
    629
    Détails du profil
    Informations forums :
    Inscription : Septembre 2008
    Messages : 629
    Par défaut
    Bonjour NoSmoking,

    Oui j'ai fait ceci
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    <text transform="matrix(1.0601 1.554557e-02 -1.466249e-02 0.9999 510.9468 502.0067)" >
             <tspan class="texte">4</tspan>
            <tspan x="10" y="0" class="texte" dy="-1ex">éme</tspan>
    </text>
    on dirais que sa fonctionne mieux.

    merci de penser à faire un retour sur ton autre discussion.
    Lequel ?


    Je te remercie et te souhaite une bonne soirée

    Max

  6. #6
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 211
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 211
    Par défaut
    Lequel ?
    voir post #2

    Oui j'ai fait ceci
    (...)
    on dirais que sa fonctionne mieux.
    oui mais ... en absence de x et/ou y les éléments suivant suivent le « flux » dans lequel ils sont, donc
    Code svg : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    <text class="texte" transform="matrix(1.0601 1.554557e-02 -1.466249e-02 0.9999 510.9468 502.0067)" >
      <tspan>4</tspan>
      <tspan dy="-1ex">éme</tspan>
      <!-- pour la suite il suffit d'annuler le décalage vertical -->
      <tspan dy="1ex"> la suite du texte</tspan>
    </text>
    de plus inutile de répéter la class sur les <tspan>, autant la mettre directement sur <text> ou encore directement dans la partie style de la page.

+ Répondre à la discussion
Cette discussion est résolue.

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo