Webxcas et exercices intéractifs

Utilisation de Xcas au lycée (sauf algorithmique), y compris projet d'epreuve pratique en Terminale S

Modérateur : xcasadmin

lucchicama
Messages : 9
Inscription : mer. avr. 02, 2014 8:39 pm

Webxcas et exercices intéractifs

Message par lucchicama » mar. mai 13, 2014 8:50 pm

Bonsoir,

Voici un petit exo intéractif créé avec giac.js, ça peut donner des idées à des collègues qui souhaitent développer des exos html5 pour leurs élèves. J'essaierai de créer un exo intéractif par semaine :

Code : Tout sélectionner

<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Des exercices intéractifs avec webxcas</title>

    <script src="http://www-fourier.ujf-grenoble.fr/~parisse/giac.js"></script>
    <script type="text/javascript">
        var GIAC = {
            caseval: Module.cwrap('_ZN4giac7casevalEPKc', 'string', ['string']),
            entree: null, // we fill this in later
            sortie: null, // we fill this in later
            x: null,
            donnee: function () {
                if (!this.sortie) {
                    this.sortie = MathJax.Hub.getAllJax("sortie")[0]
                } // find the math jax
                var nb = this.caseval("rand(1,1,9)[0]");
                var result = this.caseval("latex(expand((x+" + nb + ")^2))"); // evaluate the expression
                result = result.substr(1, result.length - 2); // remove quotation marks
                MathJax.Hub.Queue(["Text", this.sortie, result]); // typeset the result
                x = nb;
            },
            verification: function () {
                var test = 0
                with(document.nombre) {
                    if (entree.value == x) {
                        alert("BRAVO !!")
                        test = 1
                    }
                    if (test == 0) {
                        alert("Non, c'est faux !")
                    }
                }
            }
        };
    </script>
    <script type="text/x-mathjax-config">
        MathJax.Hub.Config({
            displayAlign: "left",
            displayIndent: "1em",

            tex2jax: {
                inlineMath: [
                    ["$", "$"],
                    ["\\(", "\\)"]
                ]
            },
        });
    </script>
    <script src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML-full"></script>	
</head>

<body>

    <form onsubmit="GIAC.donnee(); return false" name="nombre">
        <div class="clearfix">
            <input type="submit" value="Démarrer l'exercice">
            <br>Compléter la factorisation de :
            <div id="sortie" style="display:inline">$ $</div>
            <br>
            <p>$(x + $
                <label>
                    <input name="entree" type="text" value="" size="1" />
                </label>$)^2$</p>
            <input type="button" onclick="GIAC.verification()" value="Verification">
            <br>
            <input type="button" onclick="window.close()" value="Fermer">
        </div>
    </form>
</body>

</html>
[/color]

parisse
Messages : 5734
Inscription : mar. déc. 20, 2005 4:02 pm
Contact :

Re: Webxcas et exercices intéractifs

Message par parisse » ven. mai 16, 2014 7:34 am

Pensez-vous les mettre sur un site?

lucchicama
Messages : 9
Inscription : mer. avr. 02, 2014 8:39 pm

Re: Webxcas et exercices intéractifs

Message par lucchicama » dim. mai 18, 2014 5:20 am

Bonjour,

J'essayerai vers septembre de mettre en ligne à la fois des cours et des exercices interactifs. Pour ce faire, je m'inspire de ce que font nos collègues de Ucbeniki.

Sinon voici un autre exercice sur le thème de développement/factorisation, j'ai utilisé le Quiz-script :

Code : Tout sélectionner

<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" >
    <title> Développement/factorisation </title>
	<style>	
	math, math[mode="inline"] {
		display: inline;
		font-family: Times;
		font-style: normal;
	}

	math[mode="display"] {
		display: block;
		text-align: center;
		font-family: Times;
		font-style: normal;
	}
	</style >
    
	<script type = "text/javascript" src="http://tiensdonc.free.fr/quiz/quiz.js"></script>
</head>

<body>

    <div class="zuordnungs-quiz" lang="fr">
        <h2>Factorisation/développement</h2>
        <p> Associe les expressions à leur forme équivalentes.</p>
        <table>
            <tr>
                <td> <math mode="display "><msup><mrow><mi>x</mi></mrow><mrow><mn>2</mn></mrow></msup><mo>+</mo><mn>8</mn><mi>x</mi><mo>+</mo><mn>16</mn></math> </td>
                <td> <math><msup><mfenced open=" (" close=")" separators="anything "> <mrow><mi>x</mi><mo>+</mo><mn>4</mn></mrow></mfenced><mrow><mn>2</mn></mrow></msup></math></td>
            </tr>
            <tr>
                <td> <math mode="display "><mn>4</mn><msup><mrow><mi>x</mi></mrow><mrow><mn>2</mn></mrow></msup><mo>-</mo><mrow><mn>4</mn><mi>x</mi></mrow><mo>+</mo><mn>1</mn></math> </td>
                <td> <math mode="display "><msup><mfenced open=" (" close=")"><mrow><mn>2</mn><mi>x</mi><mo>-</mo><mn>1</mn></mrow></mfenced><mrow><mn>2</mn></mrow></msup></math> </td>
            </tr>
            <tr>
                <td> <math mode="display "><mn>100</mn><mo>-</mo><mrow><mn>36</mn><msup><mrow><mi>x</mi></mrow><mrow><mn>2</mn></mrow></msup></mrow></math> </td>
                <td> <math mode="display "><mo>(</mo><mn>10</mn><mo>-</mo><mrow><mn>6</mn><mi>x</mi></mrow> <mo>)</mo> <mo>(</mo><mn>10</mn><mo>+</mo><mn>6</mn><mi>x</mi> <mo>)</mo></math> </td>
            </tr>
            <tr>
                <td> <math mode="display "><mn>16</mn><msup><mrow><mi>x</mi></mrow><mrow><mn>2</mn></mrow></msup><mo>+</mo><mn>24</mn><mi>x</mi><mo>+</mo><mn>9</mn></math> </td>
                <td> <math mode="display "><msup><mfenced open=" (" close=")"><mrow><mn>4</mn><mi>x</mi><mo>+</mo><mn>3</mn></mrow></mfenced><mrow><mn>2</mn></mrow></msup></math> </td>
            </tr>			
        </table>
    </div>
</body>

</html>
Pour obtenir les script mathml, j'ai bien entendu utilisé la commande "mathml" de giac.js :

Code : Tout sélectionner

 <html>
        <head>
        <title>MathMl with Webxcas </title>
        <script src="http://www-fourier.ujf-grenoble.fr/~parisse/giac.js"></script>
        <script language=javascript>

        function Clear(){
                document.MainForm.input.value = '';
                document.MainForm.output.value = '';
        };

        function Show(expression){
                var NewWin
                NewWin = window.open()
                NewWin.document.write(expression)
        };

        var GIAC = {
          caseval: Module.cwrap('_ZN4giac7casevalEPKc', 'string', ['string']),
          mathml: function(expression){
                      var result = this.caseval("mathml("+expression+")");
                      result = result.substr(1,result.length-2);
                      return result ;
          }
        };
        </script>
        </head>
<body><hr><form name=MainForm method=post>
    <p>Type here your math text:&nbsp;<input type=button value="Convert" onclick="javascript:document.MainForm.output.value=GIAC.mathml(document.MainForm.input.value)">&nbsp;
    <input type=button value="Clear All" onclick="javascript:Clear()">
    <textarea name=input cols=100 rows=10></textarea>
    <hr>
    Here is the resulting to MathMl:&nbsp;<textarea name=output cols=100 rows=10></textarea><br>
    <input type=button value="Show" onclick="javascript:Show(document.MainForm.output.value)"> (show output in a new browser window) &nbsp;
    <hr>
  </form>

</body>
</html>

lucchicama
Messages : 9
Inscription : mer. avr. 02, 2014 8:39 pm

Re: Webxcas et exercices intéractifs

Message par lucchicama » sam. mai 24, 2014 4:23 am

Un exercice sur les mesures principales :

Code : Tout sélectionner

<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Des exercices intéractifs avec webxcas</title>
    <script src="http://www-fourier.ujf-grenoble.fr/~parisse/giac.js"></script>
    <script type="text/javascript">
        var GIAC = {
            caseval: Module.cwrap('_ZN4giac7casevalEPKc', 'string', ['string']),
            entree: null, // we fill this in later
            sortie: null, // we fill this in later
            x: null,
            donnee: function () {
                if (!this.sortie) {
                    this.sortie = MathJax.Hub.getAllJax("sortie")[0]
                } // find the math jax
                var a = this.caseval("rand(1,-2014,2014)[0]");
				var b = this.caseval("rand(1,[1,2,3,4,6])[0]");
                x = this.caseval(a+"*pi/"+b);				
                var result = this.caseval("latex("+a+"*pi/"+b+")"); // evaluate the expression
                result = result.substr(1, result.length - 2); // remove quotation marks
                MathJax.Hub.Queue(["Text", this.sortie, result]); // typeset the result
            },
            verification: function () {
                var test = 0
				var c = this.caseval("simplify("+x+"-round("+x+"/2/pi)*2*pi)");
                with(document.nombre) {
                    if (entree.value == c) {
                        alert("BRAVO !!")
                        test = 1
                    }
                    if (test == 0) {
                        alert("Non, c'est faux !")
                    }
                }
            }
        };
    </script>
    <script type="text/x-mathjax-config">
        MathJax.Hub.Config({
            displayAlign: "left",
            displayIndent: "1em",

            tex2jax: {
                inlineMath: [
                    ["$", "$"],
                    ["\\(", "\\)"]
                ]
            },
        });
    </script>
    <script src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML-full"></script>
</head>

<body>
    <div id="main-wrapper">
        <header>
            <h1>Mesure principale</h1>
        </header>

        <section id="content">
            <form onsubmit="GIAC.donnee(); return false" name="nombre">
                <input type="submit" value="Démarrer l'exercice">
                <br>Déterminez la mesure principale de l'angle dont une mesure en radians est :
                <div id="sortie" style="display:inline">$ $</div>
                <br>
                <p><label><input name="entree" type="text" value="" size="1" /></label></p>
                <input type="button" onclick="GIAC.verification()" value="Verification">
                <br>
                <input type="button" onclick="window.close()" value="Fermer">
            </form>
        </section>
    </div>
</body>

</html>

lucchicama
Messages : 9
Inscription : mer. avr. 02, 2014 8:39 pm

Re: Webxcas et exercices intéractifs

Message par lucchicama » dim. juin 01, 2014 7:05 pm

Un exercice sur les arguments d'un nombre complexe :

Code : Tout sélectionner

<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Des exercices intéractifs avec webxcas</title>
    <script src="http://www-fourier.ujf-grenoble.fr/~parisse/giac.js"></script>
    <script type="text/javascript">
        var GIAC = {
            caseval: Module.cwrap('_ZN4giac7casevalEPKc', 'string', ['string']),
            entree: null, // we fill this in later
            sortie: null, // we fill this in later
            x: null,
            donnee: function () {
                if (!this.sortie) {
                    this.sortie = MathJax.Hub.getAllJax("sortie")[0]
                } // find the math jax
                var z = this.caseval("rand(1,[i,1+i,-1+i,1+sqrt(3)*i,sqrt(3)+i,-sqrt(3)+i])[0]");
				x = this.caseval("arg("+z+")");
                var result = this.caseval("latex("+z+")"); // evaluate the expression
                result = result.substr(1, result.length - 2); // remove quotation marks
                MathJax.Hub.Queue(["Text", this.sortie, result]); // typeset the result
            },
            verification: function () {
                var test = 0
                with(document.nombre) {
					var c = entree.value;
					c = this.caseval("simplify("+x+"-"+c+")");
                    if (c == 0) {
                        alert("BRAVO !!")
                        test = 1
                    }
                    if (test == 0) {
                        alert("Non, c'est faux !")
                    }
                }
            }
        };
    </script>
    <script type="text/x-mathjax-config">
        MathJax.Hub.Config({
            displayAlign: "left",
            displayIndent: "1em",

            tex2jax: {
                inlineMath: [
                    ["$", "$"],
                    ["\\(", "\\)"]
                ]
            },
        });
    </script>
    <script src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML-full"></script>
    <style>
        h1 {
            color: green;
        }
    </style>
</head>

<body>
           <h1>Argument d'un nombre complexe</h1>

            <form onsubmit="GIAC.donnee(); return false" name="nombre">
                <input type="submit" value="Démarrer l'exercice">
                <br>Donner l'argument principal du nombre complexe suivant :
                <div id="sortie" style="display:inline">$ $</div>
                <br>
                <p><label><input name="entree" type="text" value="" size="1" /></label></p>
                <input type="button" onclick="GIAC.verification()" value="Verification">
                <br>
                <input type="button" onclick="window.close()" value="Fermer">
            </form>
</body>

</html>

lucchicama
Messages : 9
Inscription : mer. avr. 02, 2014 8:39 pm

Re: Webxcas et exercices intéractifs

Message par lucchicama » mer. juin 04, 2014 8:26 pm

Vous pouvez tester l'exo de nombres complexes sur JsBin : Arguments de nombres complexes

Répondre