Bonjour,
J'ai affiché un graphique à l'aide d'un canvas et maintenant je voudrais savoir s'il y a possibilité de récupérer les coordonnées d'un point du graphique en cliquant sur celui-ci en prenant en compte les axes du graphique affiché et non pas ceux du canvas.

Voici mon code :

<script>
   window.onload = function ()
   {
       RGraph.AJAX.getJSON('getJson.php', drawGraph);
   };

   function drawGraph (json)
   {
         // Now draw the chart
       line = new RGraph.Line({
           id: 'line',
           data: [json.a, json.b, json.c],
           options: {
               key: ['a','b', 'c'],
               labels: json.nom,
               title: 'Exemple courbe',
               gutterBottom: 35,
               gutterTop: 35,
               tickmarks: 'circle',
               cursor:{zoom:true},
               numxticks: 0
          }
       }).trace();
     }
     //fonction permettant de récupérer les coordonnées du pointeur
     function getCoords(el,event) {
            var ox = el.scrollLeft - el.offsetLeft,
            oy = el.scrollTop - el.offsetTop;
                while(el=el.offsetParent){
                ox += el.scrollLeft - el.offsetLeft;
                oy += el.scrollTop - el.offsetTop;
                }
       return {x:event.clientX + ox , y:event.clientY + oy};
     }
     // Exemple d'utilisation :
        line.onclick = function(e) {
        var coords = getCoords(this,e);
        alert("Clic -> X:"+coords.x+" : Y:"+coords.y);
        };
</script>
<canvas id="line" width="600" height="250">[No canvas support]</canvas><br/>

J'obtiens un graphique contenant trois courbes.
La fonction getCoords() permet d'afficher les coordonnées du pointeur en prenant en compte les axes qui définissent le canvas. Je voudrais moi prendre en compte les axes du graphique que j'ai affiché et non ceux du canvas.
Comment pourais-je procéder?

Merci.

2 réponses


Huggy
Réponse acceptée

Je ne sais pas si ça correspond à ce que tu veux mais dans cet exemple il y a transposition des coordonnées de la souris en coordonnées du graphique
http://www.rgraph.net/docs/howto-get-the-x-y-value-from-a-scatter-chart.html

Weezy
Auteur

Merci Huggy pour ta réponse, mais cette méthode ne marche que sur un seul type de graphique.