To illustrate different aspects of MathML encoding and logical sequence in which code lines are written, we undertake to write MathML codes for an equation given here :
x
=
[
32000
(
1
-
5
100
)
(
1
+
10
100
)
(
1
+
25
2
100
)
]
x = [ 32000 ( 1 -
5
100
) ( 1 +
10
100
) ( 1 +
25
2
100
) ]
Step 1 : Observe the content of the equation from left to right. Identify terms requiring expansion in vertical directions. In the given equation, there are three such terms. It is evident that “mfrac” element suits the requirement in hand. The last of three “mfrac” based expression, matter of fact, would require nested use of “mfrac” element.
Step 2 : Start from the left and write or insert basic construct of “mi” element (line 2).
1: <m:math display="block">
2: <m:mi> x </m:mi>
</m:math>
Step 3 : Copy “mi” element construct (line 2) and paste on the following line (line 3). Change “i” to “o” in order to change the initial and final tags to “mo” tags and change “x” by “=” so that code looks like :
1: <m:math display="block">
2: <m:mi> x </m:mi>
3: <m:mo> = </m:mo>
</m:math>
Step 4 : In this step, using the technique of Step 2, add following 5 lines at the end (4 to 8):
1: <m:math display="block">
2: <m:mi> x </m:mi>
3: <m:mo> = </m:mo>
4: <m:mi> x </m:mi>
5: <m:mi> x </m:mi>
6: <m:mi> x </m:mi>
7: <m:mi> x </m:mi>
8: <m:mi> x </m:mi>
</m:math>
Use appropriate token elements with identifiers, operators and numbers by modifying the newly added lines :
1: <m:math display="block">
2: <m:mi> x </m:mi>
3: <m:mo> = </m:mo>
4: <m:mo> [ </m:mo>
5: <m:mn> 3200 </m:mn>
6: <m:mo> ( </m:mo>
7: <m:mn> 1 </m:mn>
8: <m:mo> - </m:mo>
</m:math>
What you have coded till now :
x
=
[
3200
(
1
-
x = [ 3200 ( 1 -
What is to be coded ultimately :
x
=
[
32000
(
1
-
5
100
)
(
1
+
10
100
)
(
1
+
25
2
100
)
]
x =
[
32000
(
1
-
5
100
)
(
1
+
10
100
)
(
1
+
25
2
100
)
]
Step 4 : In this step, we shall handle the vertical term with “mfrac” element. Insert the basic block of “mfrac” element or type at the end (9 to 12) as shown :
1: <m:math display="block">
2: <m:mi> x </m:mi>
3: <m:mo> = </m:mo>
4: <m:mo> [ </m:mo>
5: <m:mn> 3200 </m:mn>
6: <m:mo> ( </m:mo>
7: <m:mi> 1 </m:mi>
8: <m:mo> - </m:mo>
9: <m:mfrac>
10: <m:mn> a </m:mn>
11: <m:mn> b </m:mn>
12: </m:mfrac>
</m:math>
Step 5 : Change the value of “mfrac” element’s argument as given in the equation. Copy line 6 twice and modifying the same to put a closing and opening parentheses (13 and 14). Further, add lines 15 and 16 by copying and modifying lines 7 and 8 :
1: <m:math display="block">
2: <m:mi> x </m:mi>
3: <m:mo> = </m:mo>
4: <m:mo> [ </m:mo>
5: <m:mn> 3200 </m:mn>
6: <m:mo> ( </m:mo>
7: <m:mn> 1 </m:mn>
8: <m:mo> - </m:mo>
9: <m:mfrac>
10: <m:mn> 5 </m:mn>
11: <m:mn> 100 </m:mn>
12: </m:mfrac>
13: <m:mo> ) </m:mo>
14: <m:mo> ( </m:mo>
15: <m:mn> 1 </m:mn>
16: <m:mo> + </m:mo>
</m:math>
Step 5 : Looking at the equation, it is easy to note that we need to have two fraction term with nominator and denominator. Thus, copy the block to display vertical term i.e. copy and paste “mfrac” code lines 9 to12 and modify according to the requirement(new lines 17 to 20). Copy and paste code lines 13 to 16 and modify as required (new lines 21 to 24). Finally copy and paste code lines 9 to 12 again as shown(new lines 25 to 28).
1: <m:math display="block">
2: <m:mi> x </m:mi>
3: <m:mo> = </m:mo>
4: <m:mo> [ </m:mo>
5: <m:mn> 3200 </m:mn>
6: <m:mo> ( </m:mo>
7: <m:mn> 1 </m:mn>
8: <m:mo> - </m:mo>
9: <m:mfrac>
10: <m:mn> 5 </m:mn>
11: <m:mn> 100 </m:mn>
12: </m:mfrac>
13: <m:mo> ) </m:mo>
14: <m:mo> ( </m:mo>
15: <m:mn> 1 </m:mn>
16: <m:mo> + </m:mo>
17: 9: <m:mfrac>
18: 10: <m:mn> 10 </m:mn>
19: 11: <m:mn> 100 </m:mn>
20: 12: </m:mfrac>
21: 13: <m:mo> ) </m:mo>
22: 14: <m:mo> ( </m:mo>
23: 15: <m:mn> 1 </m:mn>
24: 16: <m:mo> + </m:mo>
25: 9: <m:mfrac>
26: 10: <m:mn> 5 </m:mn>
27: 11: <m:mn> 100 </m:mn>
28: 12: </m:mfrac>
</m:math>
What you have coded till now :
x
=
[
3200
(
1
-
5
100
)
(
1
+
10
100
)
(
1
+
5
100
x = [ 3200 ( 1 -
5
100
) ( 1 +
10
100
) ( 1 +
5
100
What is to be coded ultimately :
x
=
[
32000
(
1
-
5
100
)
(
1
+
10
100
)
(
1
+
25
2
100
)
]
x =
[
32000
(
1
-
5
100
)
(
1
+
10
100
)
(
1
+
25
2
100
)
]
Step 6 : Note that last “mfrac” display requires another “mfrac” implementation. Its numerator itself is a “mfrac” display. Thus, we would require to change the line 26 placed near bottom with a block of “mfrac” codes that shall display “25/2”. For this we replace code line 26 with code block consisting of code lines 9 to 12. In order to make this block as the numerator of the parent “mfrac” element, we need to enclose this block with “mrow” element so that “mfrac” element considers the block as one argument. Change the “mo’ content (lines 10 and 11 at the bottom) to reflect the ratio as 25/2. Finally, add a closing parenthesis and a bracket at the end (lines 29 and 30) as shown.
13: <m:mo> ) </m:mo>
14: <m:mo> ( </m:mo>
15: <m:mn> 1 </m:mn>
16: <m:mo> + </m:mo>
17: 9: <m:mfrac>
18: 10: <m:mn> 10 </m:mn>
19: 11: <m:mn> 100 </m:mn>
20: 12: </m:mfrac>
21: 13: <m:mo> ) </m:mo>
22: 14: <m:mo> ( </m:mo>
23: 15: <m:mn> 1 </m:mn>
24: 16: <m:mo> + </m:mo>
25: 9: <m:mfrac>
----
<m:mrow>
9: <m:mfrac>
10: <m:mn> 25 </m:mn>
11: <m:mn> 2 </m:mn>
12: </m:mfrac>
</m:mrow>
-----
27: 11: <m:mn> 100 </m:mn>
28: 12: </m:mfrac>
29: <m:mo> ) </m:mo>
30: <m:mo> ] </m:mo>
</m:math>
Step 7 : Save the file as test.xml. The code (after renumbering for reference purpose) at this stage looks like :
13: <m:mo> ) </m:mo>
14: <m:mo> ( </m:mo>
15: <m:mn> 1 </m:mn>
16: <m:mo> + </m:mo>
17: <m:mfrac>
18: <m:mn> 10 </m:mn>
19: <m:mn> 100 </m:mn>
20: </m:mfrac>
21: <m:mo> ) </m:mo>
22: <m:mo> ( </m:mo>
23: <m:mn> 1 </m:mn>
24: <m:mo> + </m:mo>
25: <m:mfrac>
26: <m:mrow>
27: <m:mfrac>
28: <m:mn> 25 </m:mn>
29: <m:mn> 2 </m:mn>
30: </m:mfrac>
31: </m:mrow>
32: <m:mn> 100 </m:mn>
33: </m:mfrac>
34: <m:mo> ) </m:mo>
35: <m:mo> ] </m:mo>
</m:math>
What you have coded till now :
x
=
[
3200
(
1
-
5
100
)
(
1
+
10
100
)
(
1
+
5
100
)
]
x = [ 3200 ( 1 -
5
100
) ( 1 +
10
100
) ( 1 +
5
100
) ]
What is to be coded ultimately :
x
=
[
32000
(
1
-
5
100
)
(
1
+
10
100
)
(
1
+
25
2
100
)
]
x =
[
32000
(
1
-
5
100
)
(
1
+
10
100
)
(
1
+
25
2
100
)
]
Step 8 : Comparing what we have achieved so far and what is the expected, we need few tweaking here and there. First we see that the brackets have not grown to the vertical height of the terms, composing the equation. In order to do this, we club the part of equation in the brackets within “mrow” tags. Thus, we insert “mrow” tag before line 4 and at the end of the code after line 35. Also, the bars of the three central "mfrac" elements have to be distinguished from the nested one. We use "linethickness" attribute on "mfrac" element and set the same to "medium". The final code and display are shown in the example.
<m:math display="block">
<m:mi> x </m:mi>
<m:mo> = </m:mo>
<m:mrow>
<m:mo> [ </m:mo>
<m:mn> 32000 </m:mn>
<m:mo> ( </m:mo>
<m:mn> 1 </m:mn>
<m:mo> - </m:mo>
<m:mfrac linethickness="2">
<m:mn> 5 </m:mn>
<m:mn> 100 </m:mn>
</m:mfrac>
<m:mo> ) </m:mo>
<m:mo> ( </m:mo>
<m:mn> 1 </m:mn>
<m:mo> + </m:mo>
<m:mfrac linethickness="2">
<m:mn> 10 </m:mn>
<m:mn> 100 </m:mn>
</m:mfrac>
<m:mo> ) </m:mo>
<m:mo> ( </m:mo>
<m:mn> 1 </m:mn>
<m:mo> + </m:mo>
<m:mfrac linethickness="2">
<m:mrow>
<m:mfrac>
<m:mn> 25 </m:mn>
<m:mn> 2 </m:mn>
</m:mfrac>
</m:mrow>
<m:mn> 100 </m:mn>
</m:mfrac>
<m:mo> ) </m:mo>
<m:mo> ] </m:mo>
</m:mrow>
</m:math>
Save the file after editing as “test.xml”. The display looks like :
x
=
[
32000
(
1
-
5
100
)
(
1
+
10
100
)
(
1
+
25
2
100
)
]
x =
[
32000
(
1
-
5
100
)
(
1
+
10
100
)
(
1
+
25
2
100
)
]
"This is a great primer on MathML."