Meclib tutorial: Add an image - mkraska/meclib GitHub Wiki

Back to My first Meclib question

Question variables

• Find the template for Meclib objects on Wiki page Home> MecLib Question Setup
• Copy it to the question variables (after the model answer)
• Remove the dummy line ... and the comma at the end of the preceeding line.

  initdata: [
    [ "grid", "x","y", -5,5,-4,5, 50 ]
  ];
  init: stackjson_stringify(initdata);
  

This is the minimal list of Meclib objects, we are going to add objects soon. First we complete the settings. The "grid" object is always required. It defines the axes labels, the axes ranges and the size of a grid unit in points.

Question text

• Find the Question text block for Non-interactive Meclib images on Wiki page Home> MecLib Question Setup
• Copy it to the question text (between description and input fields) This block is entirely problem-independent and won't be modified however complex your question will become.

The question text should look like this:

<p>Give the general formula for the length of the hypotenuse \(c\) 
   of a right-angled triangle with sides \(a\) and \(b\).</p>

<div style="float:right">
[[jsxgraph width='250px' height='250px' ]] 
var mode  = "STACK";
var stateRef;
const initstring = {#init#};
const centeredLabelStyle = {size:0, showInfobox:false, label:{offset:[-6,0], 
  anchorX:'left', anchorY:'middle'}};
// End of STACK header
[[include src="https://raw.githubusercontent.com/mkraska/meclib/main/imeclib.js" /]]
[[/jsxgraph]]</div>

<p>[[input:S_Ha]] [[validation:S_Ha]] [[feedback:Ha]]</p>

• Press Save changes and continue editing
• Press Preview

Now we want to add a triangle. Later we will randomize it and add interactive input of the center of gravity. For now the triangle is hard-wired.

Question variables

• Goto the Wiki, find the List of Objects page and look for appropriate objects.
• Candidates are "polygon" and "line". We want a solid triangle, so we go to the "polygon" page
• Copy a template line to the list of objects
  [ "polygon", "name", [-1, 2], [0,3], [1,2],[0.5,1],[-0.5,1] ]
• We just need three vertex points. The coordinates are parametrized using variables for later randomization.
• We also adjust the "grid" object to reflect the actual size of the triangle and also reduce the grid size a little as not to waste screen space.

The contents of the question variables is now:

Ha: sqrt(a^2+b^2);

aa: 4; bb: 3;
pB: [0,0]; pC: [aa,0]; pA: [aa,bb];
initdata: [
  [ "grid", "","", -1,aa+1,-1,bb+1, 40 ],
  [ "polygon", "", pA, pB, pC ]
];
init: stackjson_stringify(initdata);

It is essential that the lists in initdata are separated by commas and that there is no comma after the last element. This frequently causes error messages when copy-pasting lines.

We use the variable names aa and bb instead of single characters because we want to keep them undefined for the algebraic input of the hypotenuse.

• Press Save changes and continue editing
• Press Preview

Now we want to label the edges. This is done using the "label" object.

• Goto the Wiki, find the List of Objects page and navigate to the "label" page.
• You see that labels can be specified using a [ "label", "name", [x, y] ] entry in the list of objects. For parametric randomized questions , it is good practice to place the label at some geometry point plus a manually adjusted correction.
• In our case we use the edge midpoints and add some correction which is found by try and error.
• Note that the label text must be bracketed in \\( and \\) to put it to math mode. This is normally not needed in names of objects. Yet the label object is also used for ordinary text, where math mode would not be appropriate.
• When adding the "label" lines as shown below, take care that all lines except the last one are followed by a comma. Missing that rule is a frequent source of unspecific error messages.

Question variables

Ha: sqrt(a^2+b^2);

aa:4; bb: 3;
pB: [0,0]; pC: [aa,0]; pA: [aa,bb];
initdata: [
  [ "grid", "","", -1,aa+1,-1,bb+1, 40 ],
  [ "polygon", "", pA, pB, pC ],
  [ "label", "\\(a\\)", (pB+pC)/2 +[ 0,-0.4] ],
  [ "label", "\\(b\\)", (pA+pC)/2 +[0.2,0] ],
  [ "label", "\\(c\\)", (pA+pB)/2 +[-0.4,0.4] ]
];
init: stackjson_stringify(initdata);

• Press Save changes and continue editing
• Press Preview

Back to My first Meclib question