Discussion :

[Philip_m]

Bonjour,

Je suis confronté à un problème que je vais essayer d'exposer le plus clairement possible.

Je suis actuellement en trein de développer une page melant du php et du svg.

le fonctionnement de ma page ce passe comme suis:

- L'utilisateur charge la page
- Un script php va récuperer les coordonées des formes à afficher ainsi que l'id de la forme dans une base de donnée
- la page est générer

exemple:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
 
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="500" height="400">
 
<rect x="0" y="0" width="500" height="400" stroke="#0E0E0E" fill="#EEEEEE"/>
<g>
<rect id="id_bdd_1" x="10" y="10" width="50" height="25" stroke-width="1" stroke="#0E0E0E" fill="red"/>
<rect id="id_bdd_2" x="70" y="10" width="50" height="25" stroke-width="1" stroke="#0E0E0E" fill="red"/>
<rect id="id_bdd_3" x="130" y="10" width="50" height="25" stroke-width="1" stroke="#0E0E0E" fill="red"/>
<rect id="id_bdd_4" x="190" y="10" width="50" height="25" stroke-width="1" stroke="#0E0E0E" fill="red"/>
</g>
</svg>

donc ma base de donnée contient pour chaque balise <rect>, l'id_bdd, la valeur de x et la valeur de y.

Mon intention est de permettre a l'utilisateur de modifier les valeurs de X et Y en fesant un simple déplacement de la forme avec la souris, puis sauvegarder les nouvelles position dans la DB à la place des anciennes.

Pour déplacer les formes avec un peu de recherche j'ai reussi a trouvé un javacript qui le permet.

La balise <g> doit être modifier pour faire appel au javascript.
Mes balise <rect> doivent etre également modifier à la génération pour faire cela.
Modifier comme suit:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
 
<rect id="id_bdd_1" x="0" y="0" transform="matrix(1 0 0 1 10 10)" width="50" height="25" stroke-width="1" stroke="#0E0E0E" fill="red"/>
<rect id="id_bdd_2" x="0" y="0" transform="matrix(1 0 0 1 70 10)" width="50" height="25" stroke-width="1" stroke="#0E0E0E" fill="red"/>

le placement des formes se trouve maintenant dans "matrix(1 0 0 1 x y)"

quand l'utilisateur déplace la forme, les informations de "matrix" change avec les nouvelles coordonnées.

la l'utilisateur valide via un submit par exemple et les nouvelle coordonnées sont récuperer.

Mon problème est que je n'arrive pas a trouvé le moyen de récuperer les nouvelles coordonnées de "matrix" afin de pouvoir les reinserer dans ma DB.

Auriez vous un solution ou un aiguillage qui me permettrais d'arriver à une résolution.

Je vous en remercie d'avance.

[Philip_m]

Bonsoir,

N'ayant pas trouvé de solution je suis passer sur des <div> avec un javascript pour les déplacés, cela marche tout aussi bien