JSXGraph use - 2 in Formula

JSXGraph use - 2 in Formula

by Miguel Bejarano -
Number of replies: 11

 in my school, Moodle administrator doesn't want to install  JSXGraph plugin for Moodle.  So I have to use:

<script type="text/javascript" src="https://jsxgraph.uni-bayreuth.de/distrib/jsxgraphcore.js"></script>

Now, Can you give me a link where  I can see a very very very simple example  complete code to pass get values and use them like student's answer.  In Formula qType.

For example: Put the point A in Coor (3 , 4)      and  the answer boxes don't appear, because the answer of  students is    A.X(),  A.Y()

Please, be specific with link (or code) because I had searched in many pages but I had not been good to find. 

Thanks.  

Average of ratings: -
In reply to Miguel Bejarano

Re: JSXGraph use - 2 in Formula

by Andreas Walter -
Picture of Plugin developers

Hello Miguel!

In fact, it's not that easy to create a minimal example, but I've tried it here. I am attaching the Moodle XML to this message. The trick is to put the inputs in a div with an id so that they can be found and read. You can also hide them this way. The board is initialized normally, but the coordinates of the point are given by the values of the inputs (so that the point stays where it was when reloading). Then you add an event handler that reads the desired values from the board and writes them into the inputs. You can also have the inputs displayed for testing.

Best wishes from the JSXGraph team, Andreas

Average of ratings: -
In reply to Andreas Walter

Re: JSXGraph use - 2 in Formula

by Miguel Bejarano -
Hello Andreas.

Every time I enter the forums I try to respond to help, but the truth is that I always receive more than I give. Please tell me, I want to make sure I understand this part of the code:

let inputs = document.getElementById('inputs-simple-example').querySelectorAll('input'), Take values from {#1}
x = inputs[0].value,
y = inputs[1].value;
 Assign first variable to x; and second to y
 if(x == "") x = 0; if(y == "") y = 0;    First time the box is empty so the point is possitioned on (0,0)

If I am correct, then I really am not perfectly understanding something:

Why look for a value in {# 1} if I already know there is nothing in the box?  Hopefully the answer is: For the second time the student's review is run.

Thank you.

Average of ratings: -
In reply to Miguel Bejarano

Re: JSXGraph use - 2 in Formula

by Andreas Walter -
Picture of Plugin developers

Hello Miguel!

You understood these lines correctly. And you also answered your second question correctly right away. You could of course display the point at (0 | 0) every time, but that would confuse the students. formulas stores the entered data (actually even if you don't submit the answer). These lines ensure that you can pick up where you left off. You could now embellish the whole thing even further by fixing the point if the question has already been submitted. But that's a little more complicated.

Best regards, Andreas

Average of ratings: -
In reply to Andreas Walter

Re: JSXGraph use - 2 in Formula

by Miguel Bejarano - 

Thank you very much Andreas. I have already made my first examples with awareness of what I am doing.

Give everyone on the JSXGraph team a hug and tell them it's from me.

Average of ratings: -
In reply to Andreas Walter

Re: JSXGraph use - 2 in Formula

by Miguel Bejarano -
Sorry Andreas.
I tested the question and its work perfectly. But, if I create a exam using your example, when the students review results, they see:


 
I changed the id names of <div> parts
I tried showing  <div> parts
Can you help me?
I made 2 more complex questions using your model question, but all exam do the same problem.

Thanks

Average of ratings: -
In reply to Miguel Bejarano

Re: JSXGraph use - 2 in Formula

by Andreas Walter -
Picture of Plugin developers

Hi!

What does the console of your browser say? Could you please attach some XML?

Average of ratings: -
In reply to Andreas Walter

Re: JSXGraph use - 2 in Formula

by Miguel Bejarano -
Of course, Andreas.

These are "your" simple question example with format changes and variables names changed. (Are the same, yours and its duplicate)

If I test question by independient way, I don't have a problem; but when exam (with two or more questions) is solved, the result is showed just first question. The rest of questions appear <div> part but no the board.

Average of ratings: -
In reply to Miguel Bejarano

Re: JSXGraph use - 2 in Formula

by Andreas Walter -
Picture of Plugin developers

Dear Miguel!

I looked at your examples and noticed two fundamental errors that concern the same principle, but once in JavaScript and once in HTML: the uniqueness.

Let's start with HTML. In HTML, each id must be unique so that the DOM object can be found. JSXGraph needs the id of a div to draw the board there. If you only display one of your examples on a page, everything is fine, since the div with the id "Caja" only exists once. However, all examples are displayed on the results page and you have given the board div the id "Caja" for each example. As a result, there are now two divs with the same id and the browser has to select a div randomly (usually the first one it finds). That's why I renamed the id to "Caja2" in your second example.

Then there is JavaScript: If JavaScript is declared directly in a

Average of ratings: -
In reply to Andreas Walter

Re: JSXGraph use - 2 in Formula

by Miguel Bejarano -
Hi Andreas
  1. Thanks. I really appreciate these helps and take advantage of as much as I can to learn and move forward with complements, ideas, and examples.
  2. I'm confused. If you see the forum I posted before coming back to you (https://moodle.org/mod/forum/discuss.php?d=424829), you will see that I made these changes at the suggestion of Bernat. My changes didn't work; however I now test the questions you send me and they work great. I didn't understand what happened.
  3. I have done complex (for me) and nice (for me too). I am happy.   


Average of ratings: -
In reply to Andreas Walter

Re: JSXGraph use - 2 in Formula

by Andreas Walter -
Picture of Plugin developers

Hi Miguel!

I just see that Moodle has shortened my answer from July 28, 2021, 5:27 p.m. There is still a lot to say! I'll continue with the last sentence:

...

Then there is JavaScript: If JavaScript is declared directly in a <script> tag, it applies to the entire document, i.e. globally. Now it's good that we store the board in a constant rather than a variable. Because that's how the browser tells us: "Plano is already declared". (in the case of a variable, the first board would simply be overwritten and there would be incomprehensible errors.)
The trick here is either to use Plano2 as well or to limit the validity range of the constant. The latter is much more elegant: you write (function () {...}) () around the code block. A function is created from the code block that will be executed immediately. The result is the same, only that the constants are not in each other's way, because they are only valid in the function.

I hope I could help

Many greetings
Andreas

Average of ratings: -
In reply to Andreas Walter

Re: JSXGraph use - 2 in Formula

by Miguel Bejarano -
ok, I got it.

And now, students answers are displayed correctly.  


Average of ratings: -