<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>MathML Tutorial - RJM Programming - July, 2014 ... thanks to http://www.tutorialspoint.com/html5/html5_mathml.htm</title>
<link href='//www.rjmprogramming.com.au/PHP/emboss_h1.css' rel='stylesheet' type='text/css'>
<script type="text/javascript">
function preanalyze(othis) {
if (document.getElementById('x').value == 'x' || document.getElementById('y').value == 'y' || document.getElementById('w').value == 'w' || document.getElementById('z').value == 'z') {
document.getElementById('x').value = "0";
document.getElementById('xx').innerHTML = "0";
document.getElementById('x2').innerHTML = "0";
document.getElementById('y').value = "0";
document.getElementById('yy').innerHTML = "0";
document.getElementById('y2').innerHTML = "0";
document.getElementById('z').value = "0";
document.getElementById('zz').innerHTML = "0";
document.getElementById('z2').innerHTML = "0";
document.getElementById('w').value = "0";
document.getElementById('ww').innerHTML = "0";
document.getElementById('w2').innerHTML = "0";
document.getElementById('myplus').style.display = 'inline';
document.getElementById('mymultiply').style.display = 'inline';
}
}
function analyze(othis) {
document.getElementById('x2').innerHTML = eval(parseFloat(document.getElementById('x').value) * 2.0);
document.getElementById('y2').innerHTML = eval(parseFloat(document.getElementById('y').value) * 2.0);
document.getElementById('z2').innerHTML = eval(parseFloat(document.getElementById('z').value) * 2.0);
document.getElementById('w2').innerHTML = eval(parseFloat(document.getElementById('w').value) * 2.0);
document.getElementById('xx').innerHTML = eval(parseFloat(document.getElementById('x').value) * parseFloat(document.getElementById('x').value) + parseFloat(document.getElementById('y').value) * parseFloat(document.getElementById('z').value));
document.getElementById('yy').innerHTML = eval(parseFloat(document.getElementById('x').value) * parseFloat(document.getElementById('y').value) + parseFloat(document.getElementById('y').value) * parseFloat(document.getElementById('w').value));
document.getElementById('zz').innerHTML = eval(parseFloat(document.getElementById('x').value) * parseFloat(document.getElementById('z').value) + parseFloat(document.getElementById('w').value) * parseFloat(document.getElementById('z').value));
document.getElementById('ww').innerHTML = eval(parseFloat(document.getElementById('w').value) * parseFloat(document.getElementById('w').value) + parseFloat(document.getElementById('y').value) * parseFloat(document.getElementById('z').value));
}
</script>
</head>
<body style="background-color: teal;">
<h1 align="center">Two By Two Same Matrix Tutorial</h1>
<table align="center" cellpadding=5 cellspacing=5 border=7 style="background-color: lightgray;">
<tr>
<td align="center">
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mrow>
<mi>A</mi>
<mo>=</mo>
<mfenced open="[" close="]">
<mtable>
<mtr>
<mtd><mi>x</mi></mtd>
<mtd><mi>y</mi></mtd>
</mtr>
<mtr>
<mtd><mi>z</mi></mtd>
<mtd><mi>w</mi></mtd>
</mtr>
</mtable>
</mfenced>
</mrow>
</math>
</td><td align="center" style="background-color: pink;"><mo><b>+</b></mo></td><td align="center">
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mrow>
<mfenced open="[" close="]">
<mtable>
<mtr>
<mtd><mi>x</mi></mtd>
<mtd><mi>y</mi></mtd>
</mtr>
<mtr>
<mtd><mi>z</mi></mtd>
<mtd><mi>w</mi></mtd>
</mtr>
</mtable>
</mfenced>
</mrow>
</math>
</td><td align="center" style="background-color:olive;"><mo>=</mo></td><td align="center">
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mrow>
<mfenced open="[" close="]">
<mtable>
<mtr>
<mtd><mi>2x</mi></mtd>
<mtd><mi>2y</mi></mtd>
</mtr>
<mtr>
<mtd><mi>2z</mi></mtd>
<mtd><mi>2w</mi></mtd>
</mtr>
</mtable>
</mfenced>
<div style="display:none; background-color:yellow;" id='myplus'>
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mo>=</mo>
<mfenced open="[" close="]">
<mtable>
<mtr>
<mtd><mi><p name=x id=x2>2x</p></mi></mtd>
<mtd><mi><p name=y id=y2>2y</p></mi></mtd>
</mtr>
<mtr>
<mtd><mi><p name=z id=z2>2z</p></mi></mtd>
<mtd><mi><p name=w id=w2>2w</p></mi></mtd>
</mtr>
</mtable>
</mfenced></math></div>
</mrow>
</math>
</td>
</tr>
<tr>
<td align="center">
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mrow>
<mi>A</mi>
<mo>=</mo>
<mfenced open="[" close="]">
<mtable>
<mtr>
<mtd><mi>x</mi></mtd>
<mtd><mi>y</mi></mtd>
</mtr>
<mtr>
<mtd><mi>z</mi></mtd>
<mtd><mi>w</mi></mtd>
</mtr>
</mtable>
</mfenced>
</mrow>
</math>
</td><td align="center" style="background-color: pink;"><mo><b>-</b></mo></td><td align="center">
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mrow>
<mfenced open="[" close="]">
<mtable>
<mtr>
<mtd><mi>x</mi></mtd>
<mtd><mi>y</mi></mtd>
</mtr>
<mtr>
<mtd><mi>z</mi></mtd>
<mtd><mi>w</mi></mtd>
</mtr>
</mtable>
</mfenced>
</mrow>
</math>
</td><td align="center" style="background-color:olive;"><mo>=</mo></td><td align="center">
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mrow>
<mfenced open="[" close="]">
<mtable>
<mtr>
<mtd><mi>0</mi></mtd>
<mtd><mi>0</mi></mtd>
</mtr>
<mtr>
<mtd><mi>0</mi></mtd>
<mtd><mi>0</mi></mtd>
</mtr>
</mtable>
</mfenced>
</mrow>
</math>
</td>
</tr>
<tr>
<td align="center">
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mrow>
<mi>A</mi>
<mo>=</mo>
<mfenced open="[" close="]">
<mtable>
<mtr>
<mtd><mi>x</mi></mtd>
<mtd><mi>y</mi></mtd>
</mtr>
<mtr>
<mtd><mi>z</mi></mtd>
<mtd><mi>w</mi></mtd>
</mtr>
</mtable>
</mfenced>
</mrow>
</math>
</td><td align="center" style="background-color: pink;"><mo><b>x</b></mo></td><td align="center">
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mrow>
<mfenced open="[" close="]">
<mtable>
<mtr>
<mtd><mi>x</mi></mtd>
<mtd><mi>y</mi></mtd>
</mtr>
<mtr>
<mtd><mi>z</mi></mtd>
<mtd><mi>w</mi></mtd>
</mtr>
</mtable>
</mfenced>
</mrow>
</math>
</td><td align="center" style="background-color:olive;"><mo>=</mo>
</td><td align="center">
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mrow>
<mfenced open="[" close="]">
<mtable>
<mtr>
<mtd>(<msup><mi>x</mi><mn>2</mn></msup>
<mo>+</mo>
<mi>y</mi><mn>z</mn>)</mtd>
<mtd>(<mi>x</mi><mn>y</mn>
<mo>+</mo>
<mi>y</mi><mn>w</mn>)</mtd>
</mtr>
<mtr>
<mtd>(<mi>z</mi><mn>x</mn>
<mo>+</mo>
<mi>w</mi><mn>z</mn>)</mtd>
<mtd>(<mi>z</mi><mn>y</mn>
<mo>+</mo>
<msup><mi>w</mi><mn>2</mn></msup>)</mtd>
</mtr>
</mtable>
</mfenced>
<div style="display:none; background-color:yellow;" id='mymultiply'>
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mo>=</mo>
<mfenced open="[" close="]">
<mtable>
<mtr>
<mtd><mi><p name=xx id=xx>(xx + yz)</p></mi></mtd>
<mtd><mi><p name=yy id=yy>(xy + yw)</p></mi></mtd>
</mtr>
<mtr>
<mtd><mi><p name=zz id=zz>(zx + wz)</p></mi></mtd>
<mtd><mi><p name=ww id=ww>(zy + ww)</p></mi></mtd>
</mtr>
</mtable>
</mfenced></math></div>
</mrow>
</math>
</td>
</tr>
<tr>
<td align="center">
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mrow>
<mi>A</mi>
<mo>=</mo>
<mfenced open="[" close="]">
<mtable>
<mtr>
<mtd><mi><input name=x id=x value=x type=text onblur=" analyze(this); " onfocus=" preanalyze(this); " onclick=" preanalyze(this); "></input></mi></mtd>
<mtd><mi><input name=y id=y value=y type=text onblur=" analyze(this); " onfocus=" preanalyze(this); " onclick=" preanalyze(this); "></input></mi></mtd>
</mtr>
<mtr>
<mtd><mi><input name=z id=z value=z type=text onblur=" analyze(this); " onfocus=" preanalyze(this); " onclick=" preanalyze(this); "></input></mi></mtd>
<mtd><mi><input name=w id=w value=w type=text onblur=" analyze(this); " onfocus=" preanalyze(this); " onclick=" preanalyze(this); "></input></mi></mtd>
</mtr>
</mtable>
</mfenced>
</mrow>
</math>
</td><td align="center" style="background-color: pink;"><mo><b>/</b></mo></td><td align="center">
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mrow>
<mfenced open="[" close="]">
<mtable>
<mtr>
<mtd><mi>x</mi></mtd>
<mtd><mi>y</mi></mtd>
</mtr>
<mtr>
<mtd><mi>z</mi></mtd>
<mtd><mi>w</mi></mtd>
</mtr>
</mtable>
</mfenced>
</mrow>
</math>
</td><td align="center" style="background-color:olive;"><mo>=</mo>
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mfenced open="[" close="]">
<mtable>
<mtr>
<mtd><mi>x</mi></mtd>
<mtd><mi>y</mi></mtd>
</mtr>
<mtr>
<mtd><mi>z</mi></mtd>
<mtd><mi>w</mi></mtd>
</mtr>
</mtable>
</mfenced>
<mo>x</mo>
<msup<mi><mfenced open="[" close="]">
<mtable>
<mtr>
<mtd><mi>x</mi></mtd>
<mtd><mi>y</mi></mtd>
</mtr>
<mtr>
<mtd><mi>z</mi></mtd>
<mtd><mi>w</mi></mtd>
</mtr>
</mtable>
</mfenced></mi><mn>-1</mn></msup></math><mo>=</mo>
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mfenced open="[" close="]">
<mtable>
<mtr>
<mtd><mi>x</mi></mtd>
<mtd><mi>y</mi></mtd>
</mtr>
<mtr>
<mtd><mi>z</mi></mtd>
<mtd><mi>w</mi></mtd>
</mtr>
</mtable>
</mfenced>
</math>
<mo>x</mo>
<mo> (1 / (xw - yz)) </mo>
<mo>x</mo>
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mfenced open="[" close="]">
<mtable>
<mtr>
<mtd><mi>w</mi></mtd>
<mtd><mi>-y</mi></mtd>
</mtr>
<mtr>
<mtd><mi>-z</mi></mtd>
<mtd><mi>x</mi></mtd>
</mtr>
</mtable>
</mfenced></math><mo> =</mo>
</td><td align="center">
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mrow>
<mo> (1 / (xw - yz)) </mo>
<mo>x</mo>
<mfenced open="[" close="]">
<mtable>
<mtr>
<mtd>(<mi>x</mi><mn>w</mn>
<mo>-</mo>
<mi>y</mi><mn>z</mn>)</mtd>
<mtd>0</mtd>
</mtr>
<mtr>
<mtd>0</mtd>
<mtd>(<mi>x</mi><mn>w</mn>
<mo>-</mo>
<mi>y</mi><mn>z</mn>)</mtd>
</mtr>
</mtable>
</mfenced><mo>=</mo>
<math xmlns="http://www.w3.org/1998/Math/MathML">
<mfenced open="[" close="]">
<mtable>
<mtr>
<mtd><mi>1</mi></mtd>
<mtd><mi>0</mi></mtd>
</mtr>
<mtr>
<mtd><mi>0</mi></mtd>
<mtd><mi>1</mi></mtd>
</mtr>
</mtable>
</mfenced></math> <a target=_blank title='Matrix division' href='http://www.mathwords.com/i/inverse_of_a_matrix.htm'>.</a>
</mrow>
</math>
</td>
</tr>
</table>
</body>
</html>