<?xml version="1.0"?>
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.1 plus MathML 2.0 plus SVG 1.1//EN"
"http://www.w3.org/2002/04/xhtml-math-svg/xhtml-math-svg.dtd">
<!-- The doctype is important for IE since it triggers MathPlayer to translate
the XHTML to HTML. -->
<!-- Using a file name that ends with .xhtml or .xht (not .html or .xml)
is important since it makes makes Firefox handle the XHTML correctly. -->
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:svg="http://www.w3.org/2000/svg"> <!-- declare svg namespace prefix -->
<head>
<title>A XHTML document with ASCIIMathML, MathML and SVG</title>
<!-- make Adobe SVGview show inline svg with namespace prefix g: -->
<object id="AdobeSVG" classid="clsid:78156a80-c6a1-4bbf-8e6a-3cd390eeb4e2">
</object><?import namespace="svg" implementation="#AdobeSVG"?>
<!-- load the ASCIIMath script (use </script> here for IE!) -->
<script src="ASCIIMathML.js" type="text/javascript"></script>
</head>
<body>
<h3>Making MathML, ASCIIMathML and SVG work together in several browsers</h3>
<p>
Creating cross-browser compatible XHTML files with MathML and inline SVG
is still quite a challenge. Here is a possible solution that also shows how
to combine these webstandards with ASCIIMath and ASCIIsvg (nonstandard but
simple input syntax for the webstandards).
</p>
<p>
This page shows how to combine valid XHTML, MathML, ASCIIMathML and
inline SVG in a way that can be viewed with
Firefox 1.5 and IE + MathPlayer + Adobe SVGview.
<a href="http://validator.w3.org/check?uri=http%3A%2F%2Fmath.chapman.edu%2F~jipsen%2Fmathml%2Fasciimathandmathmlsvg.xhtml">Validate this page</a>.
</p>
<p>
So we can have
<a href="http://www1.chapman.edu/~jipsen/mathml/asciimath.html">links</a>,
MathML fractions
<!-- could use &mathml; namespace entity, but this is more portable -->
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mfrac>
<mi>a</mi>
<mi>b</mi>
</mfrac>
</math>,
ASCIIMath fractions `sqrta/b^2` (in red, hover on it to see what was typed),
<br/>
and SVG
<svg:svg width="50px" height="50px">
<svg:circle cx="25px" cy="25px" r="20px" fill="green"/>
</svg:svg>
</p>
<p>
The XHTML source contains some comments that may help getting this to work
on your own server.
</p>
<p>
ASCIIMathML.js also works in plain HTML files (so this
is a simple way to add math support to legacy pages). However if you want
to use it together with standard MathML and SVG, you have to switch to XHTML.
</p>
<p>
Here is a version of this page that <a
href="http://math.chapman.edu/~jipsen/mathml/asciimathsvgandmathmlsvg.xhtml">
includes ASCIIsvg</a>.
</p>
<p><small>
Last modified by <a href="http://www.chapman.edu/~jipsen">Peter Jipsen</a>
<br />
<span id="lastmod"></span>
<script type="text/javascript">
document.getElementById("lastmod").innerHTML = document.lastModified
</script>
</small></p>
</body>
</html>