Jsxgraph ne se rafraichit pas

Accueil Forums Programmation WIMS Programmation d’exercices OEF Jsxgraph ne se rafraichit pas

Vous lisez 6 fils de discussion
  • Auteur
    Messages
    • #3078
      Joël
      Participant
      Up
      0
      Down
      ::

      Bonjour,

      Voilà mon problème,
      j’ai récupéré le code jsxgraph ici
      uni-bayreuth
      et voulu le transformer en exercice
      Le code original fonctionne, la figure se rafraichit.
      J’ai tenté à la volée en gardant les variables originales, la figure se rafraichit mais la réponse renvoyée n’est pas interprétée. Il semble qu’il soit indispensable de les appeler jxgbox… ? oui ou non ?
      J’ai donc changé les variables pour qu’elles soient comprises par le type de réponse jsxgraph: jxgbox_rep1 et jxgbox_var1 et là plus rien ne bouge.
      Mais le positionnement en aveugle des points est pris en compte: ça fait donc la moitié du boulot.
      Je coince donc sur le rafraichissement et l’affichage de mes tracés auxiliaires.
      J’ai tenté un board.update(); infructueux.

      Si quelqu’un à d’autres idées?
      Une erreur de newbie à dévoiler?

      Cordialement

      Le code du dernier essai:

      \text{a=randint(1..5), randint(1..5)}
      \text{b=randint(1..5), randint(1..5)}
      
      \text{script=var board = JXG.JSXGraph.initBoard('jxgbox',{boundingbox: [-8, 8, 8, -8],axis:true});
      org = board.create('point', [0,0], {style:10,visible:true,fixed:true,name:' '});
      jxgbox_rep1= board.create('point',jxgbox_var1,{style:5,color:'blue',name:'A'});
      jxgbox_rep2= board.create('point',jxgbox_var2,{style:5,color:'blue',name:'B'});
      xy=board.create('point',"X(jxgbox_rep1)+X(jxgbox_rep2)","Y(jxgbox_rep1)+Y(jxgbox_rep2)"],{style:7,color:'green',name:'A+B'});
      ax=board.create('arrow',[org,jxgbox_rep1],{strokeColor:'blue'});
      ay=board.create('arrow',[org,jxgbox_rep2],{strokeColor:'blue'});
      axy=board.create('arrow',[org,xy],{strokeColor:'red'});
      ax2=board.create('arrow',[jxgbox_rep1,xy],{strokeColor:'blue',strokeWidth:1,dash:1});
      ay2=board.create('arrow',[jxgbox_rep2,xy],{strokeColor:'blue',strokeWidth:1,dash:1});
      }
      
      \statement{
      Mettre le point A en (\a). Mettre le point B en (\b).
       \embed{r1,400x400
      jxgbox
      \script
      jxgbox_var1=[1,2] ;jxgbox_var2=[-2,-3] }
      }
      
      \answer{}{\a;\b}{type=jsxgraph}{option=precision=10}
      • Ce sujet a été modifié le il y a 8 années et 10 mois par Joël.
    • #3084
      Julien
      Modérateur
      Up
      0
      Down
      ::

      Bonjour,

      Le code suivant fonctionne.

      ++

      \title{test}
      
      \text{a=randint(1..5), randint(1..5)}
      \text{b=randint(1..5), randint(1..5)}
      
      \text{script=var board = JXG.JSXGraph.initBoard('jxgbox',{boundingbox: [-20, 20, 20, -20],axis:true});
      org = board.create('point', [0,0], {style:10,visible:true,fixed:true,name:' '});
      jxgbox_rep1= board.create('point',jxgbox_var1,{style:5,color:'blue',name:'A'});
      jxgbox_rep2= board.create('point',jxgbox_var2,{style:5,color:'blue',name:'B'});
      var aaa=function(){return (jxgbox_rep1.X()+jxgbox_rep2.X())};
      var bbb=function(){return (jxgbox_rep1.Y()+jxgbox_rep2.Y())};
      xy=board.create('point',[aaa,bbb],{style:7,color:'green',name:'A+B'});
      ax=board.create('arrow',[org,jxgbox_rep1],{strokeColor:'blue'});
      ay=board.create('arrow',[org,jxgbox_rep2],{strokeColor:'blue'});
      axy=board.create('arrow',[org,xy],{strokeColor:'red'});
      ax2=board.create('arrow',[jxgbox_rep1,xy],{strokeColor:'blue',strokeWidth:1,dash:1});
      ay2=board.create('arrow',[jxgbox_rep2,xy],{strokeColor:'blue',strokeWidth:1,dash:1});
      }
      
      \statement{
      Mettre le point A en (\a). Mettre le point B en (\b).
       \embed{r1,400x400
      jxgbox
      \script
      jxgbox_var1=[1,2] ;jxgbox_var2=[-2,-3] }
      }
      
      \answer{}{\a;\b}{type=jsxgraph}{option=precision=10}
    • #3089
      Joël
      Participant
      Up
      0
      Down
      ::

      Merci beaucoup, ça marche.

      J’essaye de comprendre la méthode mais si je déclare dans mon script original

      xy=board.create('point',[jxgbox_rep1.X()+jxgbox_rep2.X(),jxgbox_rep1.Y()+jxgbox_rep2.Y()],{style:7,color:'green',name:'A+B'});

      les flèches apparaissent mais chaque vecteur est indépendant et la somme ne se fait plus.

      Je vois que mes déclarations en javascript dans jsxgraph ne sont pas comprises.

      D’où viennent ces différences de comportement?
      Faut-il se plonger dans javascript pour comprendre? et dans ce cas un tutoriel est-il conseillé?

      Cordialement.
      Merci encore

    • #3091
      Julien
      Modérateur
      Up
      0
      Down
      ::

      Hello,

      La somme est effectuée au départ. Après il n’y a plus d’actualisation des coordonnées.
      La doc est ton ami et se trouve sur le site de jsxgraph qui est down pour le moment.

      jsxgraph.uni-bayreuth.de/wp/
      ++

    • #3092
      Julien
      Modérateur
    • #3093
      Joël
      Participant
      Up
      0
      Down
      ::

      Merci pour la doc, j’étais passé un peu vite à côté.

      Ceci dit, si je comprends, function retournerait une donnée dynamique toujours recalculée, alors que le board.create ne le fait qu’une fois.
      Pourtant le code de
      bayreuth permet d’avoir un graphe toujours actualisé.

      La différence est donc dans la méthode permettant la déclaration de xy avec [« X(x)+X(y) », »Y(x)+Y(y) »].

      Mais la je comprends pas pourquoi cela fonctionne dans un cas et pas dans l’autre

      Le code original:

      board = JXG.JSXGraph.initBoard('box', {boundingbox: [-6, 6, 8, -4], axis: true});
       
      var org = board.create('point', [0,0], {style:10,visible:true,fixed:true,name:' '});
      var x = board.create('point', [2,2], {style:5,color:'blue',name:'x'});
      var y = board.create('point', [-1,-3], {style:5,color:'blue',name:'y'});
      var xy = board.create('point', 
          ["X(x)+X(y)","Y(x)+Y(y)"], {style:7,color:'green',name:'x+y'});
      var ax =board.create('arrow', [org,x], {strokeColor:'blue'});
      var ay =board.create('arrow', [org,y], {strokeColor:'blue'});
      var axy =board.create('arrow', [org,xy], {strokeColor:'red'});
      var ax2 =board.create('arrow', [x,xy], {strokeColor:'blue',strokeWidth:1,dash:1});
      var ay2 =board.create('arrow', [y,xy], {strokeColor:'blue',strokeWidth:1,dash:1});
    • #3094
      Julien
      Modérateur
      Up
      0
      Down
      ::

      Hello,

      Une recherche sur les closures en js devrait apporter la réponse.

      ++

      • Cette réponse a été modifiée le il y a 8 années et 10 mois par Julien.
Vous lisez 6 fils de discussion
  • Vous devez être connecté pour répondre à ce sujet.