Tutoriel:Scriptons

Comme évoqué par ailleurs, il semblerait profitable d'avoir quelques pages correctement présentées, annotées afin d'aider à la prise en mains de scripts.

Les pages de référence dans la maison

Sous forum français

Manuel

Référence:JavaScript

Tutoriel:Introduction_GeoGebraScript

Scripts.

Boutons Radio

Scripts GeoGebra

1. Modifier la couleur d'un point en fonction de son ordonnée.

A titre de simple exemple, car cela peut être défini par la propriété Avancé > Couleurs dynamiques Rouge : Si[y(A) < 0, 1, 0] Vert : 0 Bleu : Si[y(A) ≥ 0, 1, 0]

Soit A un point créé, par clic droit, vous ouvrez son menu contextuel, puis le dialogue Propriétés .., onglet Script et finalement onglet Par Actualisation.

Vous tapez ou copiez/collez le code suivant SoitCouleur[A,Elément[{"rouge","bleu"},Si[y(A)<0,1,2]]] et n'oubliez pas de cliquer le bouton "OK", puis fermez le dialogue.

Lorsque vous déplacez le point A dans la fenêtre Graphique, il va prendre soit la couleur rouge si son ordonnée est négative, soit la couleur bleue si son ordonnée est positive ou nulle.

2. Pérennité du milieu d'un bipoint.

Soit 3 points A, B et M définis,

soit par M milieu de [A,B], dans ce cas, vous pouvez déplacer A et B, M sera recalculé ;
soit par B symétrique de A par rapport à M, vous pouvez déplacer A et M, B sera recalculé ;

Dans chacune de ces 2 situations, seuls 2 points sont déplaçables, par script, nous pouvons avoir les 3 points déplaçables :

Créer 3 points A, B et M à la volée Pour le point A créé, par clic droit, vous ouvrez son menu contextuel, puis le dialogue Propriétés .., onglet Script et finalement onglet Par Actualisation.

Vous tapez ou copiez/collez le code suivant SoitCoordonnées[B,2*x(M)-x(A),2*y(M)-y(A)] et n'oubliez pas de cliquer le bouton "OK", puis fermez le dialogue. Pour le point B créé, par clic droit, vous ouvrez son menu contextuel, puis le dialogue Propriétés .., onglet Script et finalement onglet Par Actualisation.

Vous tapez ou copiez/collez le code suivant SoitCoordonnées[A,2*x(M)-x(B),2*y(M)-y(B)] et n'oubliez pas de cliquer le bouton "OK", puis fermez le dialogue. Pour le point M créé, par clic droit, vous ouvrez son menu contextuel, puis le dialogue Propriétés .., onglet Script et finalement onglet Par Actualisation.

Vous tapez ou copiez/collez le code suivant SoitCoordonnées[B,2*x(M)-x(A),2*y(M)-y(A)] et n'oubliez pas de cliquer le bouton "OK", puis fermez le dialogue.

Bougez un point quelconque, la situation se mettra en place et demeurera.

3. Création d'une suite de carrés emboîtés avec indexation des sommets (Patrick Clément)

Utilisation pas à pas de la commande Exécute
(qui malheureusement depuis le rétropédalage nécessite que les commandes qui lui sont passées soient en Anglais(US).

On a au départ 2 points appelés A_{0} et B_{0}, (! merci de respecter la notation utilisant des accolades)
et un nombre appelé ind (pour indice) défini par ind=0.

Un Bouton1 de légende carrés auquel est associé Par Clic le Script GeoGebra commenté ci-dessous :

Exécute[{"C_{"+ind+"}=Rotate[A_{"+ind+"},-90°,B_{"+ind+"}]"}]
Exécute[{"D_{"+ind+"}=Rotate[B_{"+ind+"},90°,A_{"+ind+"}]"}]

Note : à partir de 2 points , construire par Rotate de ± 90° les 2 autres sommets du carré ;

Exécute[{"poly_{"+ind+"}=Polygon[A_{"+ind+"},B_{"+ind+"},C_{"+ind+"},D_{"+ind+"}]"}]

Note : maintenant que l'on a les 4 sommets, on trace le carré ;

Exécute[{"ShowLabel[ a_{"+ind+"}, false ]"}]
Exécute[{"ShowLabel[ b_{"+ind+"}, false ]"}]
Exécute[{"ShowLabel[ c_{"+ind+"}, false ]"}]
Exécute[{"ShowLabel[ d_{"+ind+"}, false]"}]

Note : On s'assure que les étiquettes des 4 côtés ne vont pas surcharger la figure ;

Exécute[{"ShowLabel[ A_{"+ind+"}, ind<4 ]"}]
Exécute[{"ShowLabel[ B_{"+ind+"}, ind<4 ]"}]
Exécute[{"ShowLabel[ C_{"+ind+"}, ind<4 ]"}]
Exécute[{"ShowLabel[ D_{"+ind+"}, ind<4 ]"}]
Exécute[{"SetVisibleInView[ A_{"+ind+"}, 1, ind<4 ]"}]
Exécute[{"SetVisibleInView[ B_{"+ind+"}, 1, ind<4 ]"}]
Exécute[{"SetVisibleInView[ C_{"+ind+"}, 1, ind<4 ]"}]
Exécute[{"SetVisibleInView[ D_{"+ind+"}, 1, ind<4 ]"}]

Note : de même que les points d'indice ≥ 4 et leurs étiquettes ne vont pas surcharger la figure ;

SoitValeur[ind,ind+1]

Note : on incrémente de 1 la valeur de l'indice ;

Exécute[{"A_{"+ind+"}=Point[Segment[A_{"+(ind-1)+"},B_{"+(ind-1)+"}],1/4]"}]
Exécute[{"B_{"+ind+"}=Point[Segment[B_{"+(ind-1)+"},C_{"+(ind-1)+"}],1/4]"}]

Note : on positionne les 2 points de base suivants, ici au quart du côté du carré venant d'être construit ;

Exécute[{"sp_{"+ind+"}=Segment[A_{"+(ind-1)+"},A_{"+(ind)+"}]"}]
Exécute[{"ShowLabel[ sp_{"+ind+"}, false]"}]
Exécute[{"SetLineThickness[ sp_{"+ind+"}, 5 ]"}]
Exécute[{"SetColor[ sp_{"+ind+"}, 1,0,0 ]"}]

Note : on construit le segment joignant 2 premiers points de base successifs, sans étiquette, d'une épaisseur de '5' et d'une couleur 'rouge' ;

Javascripts

1 Affecter un nom spécifique à l'unique objet créé par un outil utilisateur.

Résumé : On utilise un mouchard de création d'objet : registerAddListener, il doit être dans la fonction ggbOnInit, et dès qu'est créé un objet à l'aide de l'outil pisté, on travaille sur sa chaîne de définition, afin de lui affecter l'appellation désirée.

1.1 un unique antécédent, par exemple, projection orthogonale d'un point sur l'axe des abscisses. voir l'exemple dans GeoGebra.

L'objet créé va avoir une définition de la forme Outil[A], on ira lire le A entre les crochets. getDefinitionString récupère la définition de l'objet créé, definition.indexOf("ProjAxeX") examine si le nom de l'outil, ici ProjAxeX, apparaît dans la chaîne (sa position sera différente de -1), lit alors le Nom du point de départ, et affecte au point créé le nom Nom_x.

function ggbOnInit() {


ggbApplet.registerAddListener("ajout")}
function ajout(obj){

var definition =ggbApplet.getDefinitionString(obj);

Syntaxe JavaScript : Méthode indexOf
chaîne.indexOf(sous chaîne) retourne la position de la première occurrence de sous chaîne dans chaîne.
Elle retourne -1 si sous chaîne n'apparaît pas dans chaîne. Attention, elle tient compte de la casse.

var outil=definition.indexOf("ProjAxeX")

Syntaxe JavaScript : Commande if
if (condition réalisée) { il est possible de définir plusieurs conditions à remplir avec les opérateurs ET (&&) et OU (||)
liste d'instructions
}
else {
autre liste d'instructions
}

if (outil!=-1){


var DepartNom=(1+definition.indexOf("["));

var FinNom=(definition.indexOf("]"));

Syntaxe JavaScript : Méthode substring
chaîne.substring(de,à) retourne la sous-chaîne des caractères de chaîne, en commençant à l'indice de (obligatoire) inclus à l'indice à (optionnel) exclu
Attention : les indices commencent à 0. Si à n'est pas précisé, il y a extraction jusqu'à la fin de chaîne.

var Nom=definition.substring(DepartNom,FinNom);


ggbApplet.renameObject(obj,Nom+"_x");
}
}

1.2 plusieurs antécédents, par exemple, projection orthogonale d'un segment donné par ses extrémités sur l'axe des abscisses. voir l'exemple dans GeoGebra

Je reprends et complète le code précédent : l'objet créé va maintenant avoir une définition de la forme Outil[A, B], on va créer un tableau des entrées par l'instruction split. (Remarque : dans les définitions GeoGebra, la virgule est toujours suivie d'une espace.)

function ggbOnInit() {


ggbApplet.registerAddListener("ajout")}
function ajout(obj){
var definition =ggbApplet.getDefinitionString(obj);
var outil1=definition.indexOf("ProjAxeX");
var outil2=definition.indexOf("projSeg");
if (outil1!=-1 || outil2!=-1){
var DepartNom=(1+definition.indexOf("["));
var FinNom=(definition.indexOf("]"));
if (outil1!=-1){
var Nom=definition.substring(DepartNom,FinNom);
ggbApplet.renameObject(obj,Nom+"_x");}
if (outil2!=-1){

var Noms=definition.substring(DepartNom,FinNom).split(",");

Syntaxe JavaScript : Méthode split
chaîne.split(séparateur,nombre) découpe la chaîne en un tableau de sous-chaînes délimitées par le séparateur, si ce dernier est vide, on récupère un tableau de tous les caractères de la chaîne.
Le paramètre nombre, optionnel, permet de limiter le nombre de valeurs enregistrées dans le tableau.

var Nom1=Noms[0];


var Nom2=Noms[1].substring(1);
ggbApplet.renameObject(obj,"projSeg"+Nom1+Nom2);}
}
}

2 Enregistrer dans le tableur des points à leur création (à la volée ou par commande) voir l'exemple dans GeoGebra.

Résumé : On utilise un mouchard de création d'objet : registerAddListener, et dès qu'est créé un point, si on est en saisie, ses coordonnées sont enregistrées dans le tableur.

Le Javascript Global :

function ggbOnInit() {}


var g=ggbApplet;
function debut(){
g.registerAddListener("faire");}
function fin(){
g.unregisterAddListener("faire");}
function faire(M){
if (g.getObjectType(M)=="point")
{n=g.getValue('n');
n=n+1;
g.setValue('n',n);
g.evalCommand("A"+n+"=x("+M+")");
g.evalCommand("B"+n+"=y("+M+")");
}
}

Le JavaScript associé à un clic sur le bouton 'Saisie'

ggbApplet.evalCommand('SetColor(Saisie,"Red")');


ggbApplet.evalCommand('SetVisibleInView(Pause,1,true)');
debut()

Le JavaScript associé à un clic sur le bouton 'Pause' (qui n'apparaît que lorsqu'on est en mode 'saisie')

ggbApplet.evalCommand('SetCaption(Saisie,"Reprendre la saisie des points")');


ggbApplet.evalCommand('SetColor(Saisie,"Green")');
ggbApplet.evalCommand('SetVisibleInView(Pause,1,false)');
fin()

3 Enregistrer des copies d'écran

On peut créer deux points visibles dans Graphique, nommés Export_1 et Export_2, seul le rectangle de diagonale [Export_1, Export_2] sera exporté.
On définit un nombre par copie = 1 ;
et un bouton de légende "CopieGraphique" avec pour JavaScript "Par Clic" :
Il convient de mettre votre nom d'utilisateur NoeL et d'avoir créé le répertoire de stockage désiré Sorties sur votre bureau, où seront enregistrés après chaque clic sur le bouton, les fichiers Copie01.png, Copie02.png, ... Copie99.png.

var num = ggbApplet.getValue('copie');


ggbApplet.setValue('copie',num+1);
var chaine = "00"+num;
var num2 = chaine.substring(chaine.length-2);

ggbApplet.writePNGtoFile("C:/Users/NoeL/Desktop/Sorties/Copie"+num2+".png", 1, false, 300)

Variante : Remplacer la dernière ligne du code précédent par les 2 suivantes, le script vous demandera (à chaque sollicitation) votre nom d'utilisateur.

var nom=prompt("Indiquez votre nom d'utilisateur sur le PC et un fichier PNG nommé Copie.. sera enregistré sur votre bureau.");


ggbApplet.writePNGtoFile("c:\\Documents and Settings\\"+nom+"\\Desktop\\Copie"+num2+".png",1,false,300);

Fonctions et sous-programmes dans les scripts GeoGebra

Les sous-programmes ( aussi connus sous les noms de fonctions ou procédures ) sont un concept important dans la programmation informatique , et ils aident à la maintenance et à la réutilisation du code du programme . Ce tutoriel décrit quelques façons pour vous faire profiter de certains des avantages des sous-programmes dans GeoGebra .

Méthode 1 . Les outils utilisateur agissent comme une nouvelle fonction . Ils peuvent prendre des entrées et produire ensuite des objets de sortie. Vous pouvez les appeler depuis la barre d'outils , ou depuis la barre d'entrée ou depuis des scripts.

Méthode 2 . Toutes les fonctions Javascript que vous définissez dans la section JavaScript global de l'onglet script seront disponibles pour être utilisées par Javascript ailleurs dans GeoGebra .

Méthode 3 . GeoGebra Script ne fournit pas de support intégré pour les sous-programmes , mais on peut obtenir les mêmes résultats en utilisant la commande LanceScriptClic[ ]. Créer un objet , appelons-le monObjet , et entrez un code de script Par Clic pour monObjet . Vous pouvez ensuite appeler le code d'autres objets ou de la barre d'entrée en utilisant LanceScriptClic[ monObjet ] . Si nécessaire , les entrées et sorties peuvent être transmises à la sous-routine par des objets supplémentaires .

Voici un exemple plus détaillé . Supposons que vous ayez 5 points A, B , C , D et E , et que vous vouliez que chaque point devienne rouge quand on clique dessus . Une façon d'y parvenir est d' écrire un script distinct Par Clic pour chaque point : pour le point A vous utilisez SoitCouleur[ A, 1,0,0 ] ; pour le point B, vous utilisez SoitCouleur[ B , 1,0 , 0 ] , etc. Cependant, si vous décidez de changer du rouge au vert plus tard , alors vous devrez modifier le script de chaque point séparément . Si vous avez beaucoup de points , cela peut être fastidieux .

Au lieu de cela , nous allons utiliser un sous-programme . Créez un objet texte appelé cible en tapant

cible = "A"

dans la barre de saisie. Nous allons utiliser cet objet comme une entrée pour notre fonction .

Ensuite créez un bouton appelé monBouton. (Vous n'avez pas besoin d'utiliser un bouton , en fait , n'importe quel objet devrait fonctionner tout aussi bien ). Dans le script Par Clic de monBouton, entrez le texte suivant :

Exécute[ {" SetColor[" + cible + " , 1,0,0 ] "} ]

Maintenant, ouvrez le dialogue Propriétés du point A et entrez la commande suivante dans le script Par Clic de A:

cible = "A"

LanceScriptClic[monBouton]

Faites de même pour B , C , D et E , mais en remplaçant le «A» dans la première ligne par «B» , «C» , «D» , «E» respectivement . Maintenant, lorsque vous cliquez sur l'un des points A, B , C ou D , il passe au rouge . Si vous décidez que vous voulez utiliser à la place verte , il vous suffit de changer la ligne dans Par Clic de 'monBouton' et la modification prendra effet pour A, B , C , D et E. Si vous avez un grand nombre de points , alors cette méthode peut être plus pratique que d'avoir à modifier le script de chaque point séparément !

Comment cela marche? Lorsque vous cliquez sur un point , disons «B» , alors le script ' Par Clic ' de B stocke le nom 'B' dans l'objet texte 'cible' . Il exécute ensuite le sous-programme que nous avons défini dans le script ' Par Clic ' de 'monBouton' avec la commande LanceScriptClic[monBouton].

Le script Par Clic de 'monBouton' s'exécute maintenant . La ligne Exécute[ {" SetColor [" + cible + " , 1,0,0 ] "} ] construit une commande GeoGebra (c'est la partie SetColor [" + cible + " , 1,0,0 ] ) , puis la valide à l'aide de la commande Exécute[ ] . Le résultat final est que la commande SetColor[ B , 1,0,0 ] est exécutée , en faisant passer la couleur de B au rouge .

Mouchards

Suite à une question sur le forum, créer des points, et surtout pouvoir en supprimer ! (et récupérer le diagramme de Voronoi, mais ça peut servir dans d'autres cas).

Raymond Ami coupe en 2 : Déclaration au départ dans ggbOnInit() JavaScript global

Idée : Déclaration au départ dans ggbOnInit() JavaScript global

function ggbOnInit() {

ggbApplet.registerAddListener("UPD")

ggbApplet.registerRemoveListener("UPD")

}

function UPD() {

ggbApplet.evalCommand("RunClickScript(buttonUPD)")

}

Mais la fonctionJS appelée par l'un ou l'autre des mouchards est définie dans le script d'un objet

Ici, le Script Par Clic d'un bouton nommé buttonUPD

Note : Script Par Clic d'un bouton nommé buttonUPD

// code is not created as function in GlobalJS,

// - so GGB/JS give error messages

// - so it's possible to change without save/restore

//-------------------------------------------------------------------------

// Listener works asynchron, so Listener must be stopped

ggbApplet.unregisterAddListener("UPD")

ggbApplet.unregisterRemoveListener("UPD")

// create pointList as an empty List

pointList= []

// Fill pointList with all exist point-names

for (i = 0; i< ggbApplet.getObjectNumber();i++){

if (ggbApplet.getObjectType(ggbApplet.getObjectName(i)) == "point") {

pointList.push(ggbApplet.getObjectName(i))

}

// change syntax JS-List to syntax ggb-List

pointList = "{"+pointList+"}"

// create a new object voronoi with all exists points

ggbApplet.evalCommand("voronoi = Voronoi("+pointList+")")

// now Listener are restarted

ggbApplet.registerAddListener("UPD")

ggbApplet.registerRemoveListener("UPD")