1 / 26

XML for MathML

XML for MathML. XHTML does not allow for any description of mathematical equations, thus browsers unable to render them XML has been used to specify a new markup language, MathML, to describe the structure and content of equations

saxton
Download Presentation

XML for MathML

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. XML for MathML • XHTML does not allow for any description of mathematical equations, thus browsers unable to render them • XML has been used to specify a new markup language, MathML, to describe the structure and content of equations • Equations may be described by their layout (presentation markup), or by groupings of operators and operands (content markup)

  2. MathML – Presentation markup • Normally used for displaying equations in a visual medium • Can be used for audio presentation • Markup expresses syntactic layout of operators and operands • Symbols are represented by character specifications • Not all symbols are rendered

  3. Element mrow behaves like parentheses, which allows the document author to group related elements properly. 1 <?xml version="1.0"?> 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 3 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 4 5 <!-- Fig. 20.9: mathml1.html --> 6 <!-- Simple MathML --> 7 8 <html xmlns="http://www.w3.org/1999/xhtml"> 9 10 <head><title>Simple MathML Example</title></head> 11 12 <body> 13 14 <math xmlns ="http://www.w3.org/1998/Math/MathML"> 15 16 <mrow> 17 <mn>2</mn> 18 <mo>+</mo> 19 <mn>3</mn> 20 <mo>=</mo> 21 <mn>5</mn> 22 </mrow> 23 24 </math> 25 26 </body> 27</html> Mathml1.htmlProgram Output

  4. entity reference &InvisibleTimes; to indicate a multiplication operation without a symbolicrepresentation. The msup element represents a superscript. Element mfracdisplay a fraction. 1 <?xml version="1.0"?> 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 3 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 4 <!-- Fig. 20.10: mathml2.html --> 5 <!-- Simple MathML --> 6 7 <html xmlns="http://www.w3.org/1999/xhtml"> 8 9 <head><title>Algebraic MathML Example</title></head> 10 11 <body> 12 13 <math xmlns ="http://www.w3.org/1998/Math/MathML"> 14 <mrow> 15 16 <mrow> 17 <mn>3</mn> 18 <mo>&InvisibleTimes;</mo> 19 20 <msup> 21 <mi>x</mi> 22 <mn>2</mn> 23 </msup> 24 25 </mrow> 26 27 <mo>+</mo> 28 <mi>x</mi> 29 <mo>-</mo> 30 31 <mfrac> 32 <mn>2</mn> 33 <mi>x</mi> 34 </mfrac> 35 Mathml2.html

  5. 36 <mo>=</mo> 37 <mn>0</mn> 38 39 </mrow> 40 </math> 41 42 </body> 43 </html> Mathml2.htmlProgram Output

  6. The entity &Integral; represents the integral symbol. Element mo marks up the integral operator. Element mn marks up the number (i.e., 0) that represents the subscript. The msubsup element specifies the superscript and subscript. Elementmsqrt represents a square root expression. 1 <?xml version="1.0"?> 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 3 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 4 <!-- Fig. 20.11 mathml3.html --> 5 <!-- Calculus example using MathML --> 6 7 <html xmlns="http://www.w3.org/1999/xhtml"> 8 9 <head><title>Calculus MathML Example</title></head> 10 11 <body> 12 13 <math xmlns = "http://www.w3.org/1998/Math/MathML"> 14 <mrow> 15 <msubsup> 16 17 <mo>&Integral;</mo> 18 <mn>0</mn> 19 20 <mrow> 21 <mn>1</mn> 22 <mo>-</mo> 23 <mi>y</mi> 24 </mrow> 25 26 </msubsup> 27 28 <msqrt> 29 <mrow> 30 31 <mn>4</mn> 32 <mo>&InvisibleTimes;</mo> 33 Mathml3.html

  7. Entity&delta; represents a delta symbol. 34 <msup> 35 <mi>x</mi> 36 <mn>2</mn> 37 </msup> 38 39 <mo>+</mo> 40 <mi>y</mi> 41 42 </mrow> 43 </msqrt> 44 45 <mo>&delta;</mo> 46 <mi>x</mi> 47 </mrow> 48 </math> 49 </body> 50 </html> Mathm13.htmlProgram Output

  8. MathML – Content markup • Describes the underlying mathematical structure of an equation • Representation does not change if a different rendering preference is used, e.g. multiplication • Defines basic constructs allowing definition of other constructs to extend the mathematical vocabulary • Uses operator prefix notation

  9. 1 <?xml version="1.0"?> 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 3 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 4 5 <!-- Fig. 20.9: mathml1.html --> 6 <!-- Simple Content markul --> 7 8 <html xmlns="http://www.w3.org/1999/xhtml"> 9 10 <head><title>Simple Content markup Example</title></head> 11 12 <body> 13 14 <math xmlns ="http://www.w3.org/1998/Math/MathML"> 15 16 <mrow> 17 <apply> 18 <eq/> 19 <apply> 20 <plus/> 21 <cn>3</cn> 22 <cn>2</cn> 23 </apply> 24<cn>5</cn> 25 </apply> 26 </mrow> 27 </math> 28</body> 29 </html> Mathml4.htmlProgram Output

  10. A processing instruction(PI is application-specific information embedded in an XML document. A value of x2 and typefloat specifies that the element contains a list of floating-point numbers, each of which indicates the x-coordinate of an atom. Element bondArray defines the bonds between atoms. A value of y2 specifies that the element contains a list of y-coordinate values. 1 <?jumbo:namespace ns = "http://www.xml-cml.org" 2 prefix = "C" java = "jumbo.cmlxml.*Node" ?> 3 4 <!-- Fig. 20.12 : ammonia.xml --> 5 <!-- Structure of ammonia --> 6 7 <C:molecule id = "Ammonia"> 8 9 <C:atomArray builtin = "elsym"> 10 N H H H 11 </C:atomArray> 12 13 <C:atomArray builtin = "x2" type = "float"> 14 1.5 0.0 1.5 3.0 15 </C:atomArray> 16 17 <C:atomArray builtin = "y2" type = "float"> 18 1.5 1.5 0.0 1.5 19 </C:atomArray> 20 21 <C:bondArray builtin = "atid1"> 22 1 1 1 23 </C:bondArray> 24 25 <C:bondArray builtin = "atid2"> 26 2 3 4 27 </C:bondArray> 28 29 <C:bondArray builtin = "order" type = "integer"> 30 1 1 1 31 </C:bondArray> 32 33 </C:molecule> Ammonia.xml

  11. Program Output

  12. 20.7 DOM Methods

  13. 20.7 DOM Methods article title date author firstName summary lastName contents Fig. 20.14 Tree structure for article.xml.

  14. Instantiate a Microsoft XML Document Object Model object and assign it to reference xmlDocument. Property documentElement corresponds to the root element in the document (e.g., article). method load loads article.xml (Fig. 20.1) into memory. Property nodeName corresponds to the name of an element, attribute, etc. Iterates through the root node’s children using property childNodes. Method item to obtain the child node at index i. 1 <?xml version="1.0"?> 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 3 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 4 <html xmlns="http://www.w3.org/1999/xhtml"> 5 6 <!-- Fig. 20.15 : DOMExample.html --> 7 <!-- DOM with JavaScript --> 8 9 <head> 10 <title>A DOM Example</title> 11 </head> 12 13 <body> 14 15 <script type ="text/javascript"language ="JavaScript"> 16 <!-- 17 var xmlDocument = new ActiveXObject( "Microsoft.XMLDOM" ); 18 xmlDocument.async = false; // forces synchronous loading 19 xmlDocument.load( "article.xml" ); 20 21 // get the root element 22 var element = xmlDocument.documentElement; 23 24 document.writeln( 25 "<p>Here is the root node of the document: " + 26 "<strong>" + element.nodeName + "</strong>" + 27 "<br />The following are its child elements:" + 28 "</p><ul>" ); 29 30 // traverse all child nodes of root element 31 for ( var i = 0; i < element.childNodes.length; i++ ) { 32 var curNode = element.childNodes.item( i ); 33 DOMExample.html

  15. Retrieve the root node’s first child node (i.e., title) using property firstChild. Property parentNode returns a node’s parent node. 34 // print node name of each child element 35 document.writeln( "<li><strong>" + curNode.nodeName 36 + "</strong></li>" ); 37 } 38 39 document.writeln( "</ul>" ); 40 41 // get the first child node of root element 42 var currentNode = element.firstChild; 43 44 document.writeln( "<p>The first child of root node is: " + 45 "<strong>" + currentNode.nodeName + "</strong>" + 46 "<br />whose next sibling is:" ); 47 48 // get the next sibling of first child 49 var nextSib = currentNode.nextSibling; 50 51 document.writeln( "<strong>" + nextSib.nodeName + 52 "</strong>.<br />Value of <strong>" + 53 nextSib.nodeName + "</strong> element is: " ); 54 55 var value = nextSib.firstChild; 56 57 // print the text value of the sibling 58 document.writeln( "<em>" + value.nodeValue + "</em>" + 59 "<br />Parent node of <strong>" + nextSib.nodeName + 60 "</strong> is: <strong>" + 61 nextSib.parentNode.nodeName + "</strong>.</p>" ); 62 --> 63 </script> 64 65 </body> 66 </html> DOMExample.html

  16. Program Output

  17. XML DOM for Netscape • Netscape does not support the ActiveXObject interface used by Internet Explorer • Instead document.implementation.createDocument() is used to create a new document instance • The official W3C DOM Core functions are then used to access the XML document structure

  18. Deciding which implementation to use • The following code fragment can be used to select the appropriate document access method between Netscape and Internet Explorer if (document.implementation && document.implementation.createDocument) { xmlDocument = document.implementation.createDocument("","",null); } else if (window.ActiveXObject) { xmlDocument = new ActiveXObject("Microsoft.XMLDOM"); } else { alert("Your browser can't handle this script"); return; }

  19. 1 <?xml version="1.0"?> 2 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 3 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 4 <html xmlns="http://www.w3.org/1999/xhtml"> 5 6 <!-- Fig. 20.15 : DOMExample.html --> 7 <!-- DOM with JavaScript --> 8 9 <head> 10 <title>A DOM Example</title> 11 </head> 12 13 <body> 14 15 <script type ="text/javascript"language ="JavaScript"> 16 <!-- 17 if (document.implementation && 18document.implementation.createDocument) { 19 var xmlDocument = 20document.implementation.createDocument("","",null); 21 xmlDocument.onload = generatePage; 22} else if (window.ActiveXObject) { 23 var xmlDocument = new ActiveXObject( "Microsoft.XMLDOM" ); 24 xmlDocument.async = false; 25 } else { 26 alert("Your browser can't handle this script!"); 27 return; 28 } 29 30 xmlDocument.load( "article.xml" ); 31 32 if (window.ActiveXObject) { 33generatePage(); DOMExample2.html

  20. 34 } 35 36 functiongeneratePage() { 37 // get the root element 38 var element = xmlDocument.documentElement; 39 40 text = "<p>Here is the root node of the document: " + 41 "<strong>" + element.nodeName + "</strong>" + 42 "<br />The following are its child elements:" + 43 "</p><ul>"; 44 45 // traverse all child nodes of root element 46 for ( var i = 0; i < element.childNodes.length; i++ ) { 47 var curNode = element.childNodes.item( i ); 48 49 // print node name of each child element 50 text += "<li><strong>" + curNode.nodeName 51 + "</strong></li>"; 52 } 53 54 text += "</ul>"; 55 56 // get the first child node of root element 57 var currentNode = element.firstChild; 58 59 text += "<p>The first child of root node is: " + 60 "<strong>" + currentNode.nodeName + "</strong>" + 61 "<br />whose next sibling is:"; 62 63 // get the next sibling of first child 64 var nextSib = currentNode.nextSibling; 65 66 text += "<strong>" + nextSib.nodeName + DOMExample2.html

  21. 67 "</strong>.<br />Value of <strong>" + 68 nextSib.nodeName + "</strong> element is: "; 69 70 var value = nextSib.firstChild; 71 72 // print the text value of the sibling 73 text += "<em>" + value.nodeValue + "</em>" + 74 "<br />Parent node of <strong>" + nextSib.nodeName + 75 "</strong> is: <strong>" + 76 nextSib.parentNode.nodeName + "</strong>.</p>"; 77 document.body.innerHTML = text; 78 } 79 --> 80 </script> 81 82 </body> 83 </html> DOMExample2.html

  22. 20.7 DOM Methods

  23. 20.7 DOM Methods

  24. 20.7 DOM Methods

  25. 20.7 DOM Methods

  26. XML DOM resources • There is DOM support for Java, Javascript, Perl, PHP, C++, Python, etc. • Most developers seek conformance with W3C DOM • Object oriented approach used • See documentation to determine level of conformance to W3C

More Related