Codes SVG de figures mathématiques
-->
$A$ $\overline{A}$ $B$ $\overline{B}$ $B$ $\overline{B}$
<svg width="250" height="250" id="figure95" onclick="change_figure95()">
  <g>
    <line fill="none" stroke-width="2" stroke="#000000" y2="80" x2="100" y1="140" x1="20"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="80" x2="100" y1="140" x1="20"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="200" x2="100" y1="140" x1="20"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="40" x2="220" y1="75" x1="125"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="110" x2="220" y1="85" x1="125"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="160" x2="220" y1="195" x1="125"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="230" x2="220" y1="205" x1="125"/>
    <foreignObject x='102' y='70' width='20' height='100'>$A$</foreignObject>
    <foreignObject x='102' y='190' width='20' height='100'>$\overline{A}$</foreignObject>
    <foreignObject x='225' y='35' width='20' height='100'>$B$</foreignObject>
    <foreignObject x='225' y='105' width='20' height='100'>$\overline{B}$</foreignObject>
    <foreignObject x='225' y='155' width='20' height='100'>$B$</foreignObject>
    <foreignObject x='225' y='225' width='20' height='100'>$\overline{B}$</foreignObject>
   </g>
</svg>
<!-- Le script d'ajout ne fonctionne pas avec du mathjax -->
$A$ $\overline{A}$ $B$ $\overline{B}$ $B$ $\overline{B}$ 0,75 0,25 0,1 0,9 0,3 0,7
<svg width="250" height="250" id="figure85" onclick="change_figure95()">
  <g>
    <line fill="none" stroke-width="2" stroke="#000000" y2="80" x2="100" y1="140" x1="20"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="80" x2="100" y1="140" x1="20"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="200" x2="100" y1="140" x1="20"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="40" x2="220" y1="75" x1="125"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="110" x2="220" y1="85" x1="125"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="160" x2="220" y1="195" x1="125"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="230" x2="220" y1="205" x1="125"/>
    <foreignObject x='102' y='70' width='20' height='100'>$A$</foreignObject>
    <foreignObject x='102' y='190' width='20' height='100'>$\overline{A}$</foreignObject>
    <foreignObject x='225' y='35' width='20' height='100'>$B$</foreignObject>
    <foreignObject x='225' y='105' width='20' height='100'>$\overline{B}$</foreignObject>
    <foreignObject x='225' y='155' width='20' height='100'>$B$</foreignObject>
    <foreignObject x='225' y='225' width='20' height='100'>$\overline{B}$</foreignObject>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="95" x="55">0,75</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="200" x="55">0,25</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="50" x="170">0,1</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="120" x="170">0,9</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="170" x="170">0,3</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="240" x="170">0,7</text>
   </g>
</svg>
<!-- Le script d'ajout ne fonctionne pas avec du mathjax -->
$A$ $\overline{A}$ $B$ $C$ $D$ $B$ $C$ $D$ 0,75 0,25 0,1 0,4 0,5 0,3 0,3 0,4
<svg width="250" height="370" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" id="figure85" onclick="change_figure95()">
  <g>
    <line fill="none" stroke-width="2" stroke="#000000" y2="80" x2="100" y1="180" x1="20"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="280" x2="100" y1="180" x1="20"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="10" x2="220" y1="75" x1="125"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="80" x2="220" y1="80" x1="125"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="150" x2="220" y1="85" x1="125"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="210" x2="220" y1="275" x1="125"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="280" x2="220" y1="280" x1="125"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="350" x2="220" y1="285" x1="125"/>
    <foreignObject x='102' y='70' width='20' height='100'>$A$</foreignObject>
    <foreignObject x='102' y='270' width='20' height='100'>$\overline{A}$</foreignObject>
    <foreignObject x='225' y='0' width='20' height='100'>$B$</foreignObject>
    <foreignObject x='225' y='70' width='20' height='100'>$C$</foreignObject>
    <foreignObject x='225' y='145' width='20' height='100'>$D$</foreignObject>
    <foreignObject x='225' y='200' width='20' height='100'>$B$</foreignObject>
    <foreignObject x='225' y='270' width='20' height='100'>$C$</foreignObject>
    <foreignObject x='225' y='340' width='20' height='100'>$D$</foreignObject>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="110" x="55">0,75</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="260" x="55">0,25</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="30" x="170">0,1</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="70" x="170">0,4</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="145" x="170">0,5</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="230" x="170">0,3</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="270" x="170">0,3</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="340" x="170">0,4</text>
  </g>
</svg>

<!-- Le script d'ajout ne fonctionne pas avec du mathjax -->
$A$ $B$ $C$ $D$ $\overline{D}$ $D$ $\overline{D}$ $D$ $\overline{D}$ 0,7 0,1 0,2 0,1 0,9 0,5 0,5 0,3 0,7
<svg width="250" height="370" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" id="figure85" onclick="change_figure95()">
  <g>
    <line fill="none" stroke-width="2" stroke="#000000" y2="80" x2="100" y1="180" x1="20"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="280" x2="100" y1="180" x1="20"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="180" x2="100" y1="180" x1="20"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="40" x2="220" y1="75" x1="125"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="100" x2="220" y1="80" x1="125"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="150" x2="220" y1="175" x1="125"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="210" x2="220" y1="185" x1="125"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="250" x2="220" y1="280" x1="125"/>
    <line fill="none" stroke-width="2" stroke="#000000" y2="310" x2="220" y1="285" x1="125"/>
    <foreignObject x='102' y='70' width='20' height='100'>$A$</foreignObject>
    <foreignObject x='102' y='170' width='20' height='100'>$B$</foreignObject>
    <foreignObject x='102' y='270' width='20' height='100'>$C$</foreignObject>
    <foreignObject x='225' y='30' width='20' height='100'>$D$</foreignObject>
    <foreignObject x='225' y='90' width='20' height='100'>$\overline{D}$</foreignObject>
    <foreignObject x='225' y='145' width='20' height='100'>$D$</foreignObject>
    <foreignObject x='225' y='200' width='20' height='100'>$\overline{D}$</foreignObject>
    <foreignObject x='225' y='240' width='20' height='100'>$D$</foreignObject>
    <foreignObject x='225' y='300' width='20' height='100'>$\overline{D}$</foreignObject>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="110" x="55">0,7</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="170" x="55">0,1</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="260" x="55">0,2</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="50" x="170">0,1</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="110" x="170">0,9</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="155" x="170">0,5</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="220" x="170">0,5</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="255" x="170">0,3</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="315" x="170">0,7</text>
  </g>
</svg>

<!-- Le script d'ajout ne fonctionne pas avec du mathjax -->
A B C D E F G H
<svg width="300" height="300" id="figure96" onclick="change_figure96()">
  <g>
    <rect stroke-width="2" stroke="#000000" fill="none" id="svg_1" height="180" width="180" y="70" x="40"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" id="svg_2" y2="40" x2="100" y1="70" x1="40"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" id="svg_3" y2="40" x2="280" y1="70" x1="220"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" id="svg_4" y2="220" x2="280" y1="250" x1="220"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" id="svg_5" y2="220" x2="280" y1="40" x1="280"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" id="svg_6" y2="40" x2="100" y1="40" x1="280"/>
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" id="svg_7" y2="220" x2="100" y1="40" x1="100"/>
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" id="svg_8" y2="220" x2="100" y1="250" x1="40"/>
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" id="svg_9" y2="220" x2="100" y1="220" x1="280"/>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="269" x="27">A</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_11" y="268" x="229">B</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_12" y="229" x="290">C</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_13" y="240" x="105">D</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_14" y="76" x="23">E</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_15" y="83" x="235">F</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_16" y="35" x="286">G</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_17" y="30" x="105">H</text>
  </g>
</svg>

<script type="text/javascript" >
function change_figure96() {
    var ajout = '';
    $("#figure96").html( $("#figure96").html() + ajout );
}
</script>
A B C D E F G H
<svg width="400" height="300" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" id="figure97" onclick="change_figure97()">
  <g>
    <rect stroke-width="2" stroke="#000000" fill="none" id="svg_1" height="180" width="280" y="70" x="40"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" id="svg_2" y2="40" x2="100" y1="70" x1="40"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" id="svg_3" y2="40" x2="380" y1="70" x1="320"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" id="svg_4" y2="220" x2="380" y1="250" x1="320"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" id="svg_5" y2="220" x2="380" y1="40" x1="380"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" id="svg_6" y2="40" x2="100" y1="40" x1="380"/>
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" id="svg_7" y2="220" x2="100" y1="40" x1="100"/>
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" id="svg_8" y2="220" x2="100" y1="250" x1="40"/>
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" id="svg_9" y2="220" x2="100" y1="220" x1="380"/>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="269" x="27">A</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_11" y="268" x="329">B</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_12" y="229" x="390">C</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_13" y="240" x="105">D</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_14" y="76" x="23">E</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_15" y="83" x="335">F</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_16" y="35" x="386">G</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_17" y="30" x="105">H</text>
  </g>
</svg>

<script type="text/javascript" >
function change_figure97() {
    var ajout = '';
    $("#figure97").html( $("#figure97").html() + ajout );
}
</script>
A B C D E
<svg width="300" height="300" id="figure98" onclick="change_figure98()">
  <g>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" y2="250" x2="40" y1="250" x1="220"/>
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" y2="220" x2="100" y1="250" x1="40"/>
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" y2="220" x2="100" y1="220" x1="280"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" y2="250" x2="220" y1="220" x1="280"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" y2="40" x2="150" y1="250" x1="40"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" y2="40" x2="150" y1="250" x1="220"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" y2="40" x2="150" y1="220" x1="280"/>
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" y2="40" x2="150" y1="220" x1="100"/>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="269" x="27">A</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_11" y="268" x="229">B</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_12" y="229" x="290">C</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_13" y="240" x="105">D</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_14" y="30" x="150">E</text>
  </g>
</svg>

<script type="text/javascript" >
function change_figure98() {
    var ajout = '';
    $("#figure98").html( $("#figure98").html() + ajout );
}
</script>
A B C D
<svg width="300" height="300" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" id="figure99" onclick="change_figure99()">
  <g>
    <line fill="none" stroke-width="2" stroke="#000000" id="svg_1" y2="208" x2="36" y1="62" x1="138"/>
    <line fill="none" stroke-width="2" stroke="#000000" id="svg_2" y2="251" x2="165" y1="208" x1="36"/>
    <line fill="none" stroke-width="2" stroke="#000000" id="svg_3" y2="62" x2="138" y1="251" x1="165"/>
    <line fill="none" stroke-width="2" stroke="#000000" id="svg_4" y2="188" x2="246" y1="251" x1="165"/>
    <line fill="none" stroke-width="2" stroke="#000000" id="svg_5" y2="62" x2="138" y1="188" x1="246"/>
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" id="svg_6" y2="208" x2="36" y1="188" x1="246"/>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_7" y="50" x="134">A</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_8" y="217" x="25">B</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_9" y="276" x="166">C</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="196" x="259">D</text>
  </g>
</svg>

<script type="text/javascript" >
function change_figure99() {
    var ajout = '';
    $("#figure99").html( $("#figure99").html() + ajout );
}
</script>
<svg width="300" height="300" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" id="figure100" onclick="change_figure100()">
  <g>
    <ellipse stroke-dasharray="null" stroke-width="2" stroke="#000000" fill="none" id="svg_10" ry="18.5" rx="61" cy="83" cx="147"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" id="svg_11" y2="83" x2="85" y1="238" x1="85"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" id="svg_12" y2="83" x2="208" y1="238" x1="208"/>
    <path d="M85 238 A 61 18.5 0 0 1 208 238" fill="none" stroke="#000000" stroke-width="2" stroke-dasharray="5,5"/>
    <path d="M85 238 A 61 18.5 0 0 0 208 238" fill="none" stroke="#000000" stroke-width="2" />
  </g>
</svg>

<script type="text/javascript" >
function change_figure100() {
    var ajout = '';
    $("#figure100").html( $("#figure100").html() + ajout );
}
</script>
<svg width="300" height="300" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" id="figure200" onclick="change_figure200()">
  <g>
    <ellipse cx="147" cy="83" rx="61" ry="18.5" id="svg_10" fill="none" stroke="#000000" stroke-width="2" stroke-dasharray="null"/>
    <line x1="85" y1="238" x2="85" y2="83" id="svg_11" stroke="#000000" stroke-width="2" stroke-dasharray="null" fill="none"/>
    <line x1="208" y1="238" x2="208" y2="83" id="svg_12" stroke="#000000" stroke-width="2" stroke-dasharray="null" fill="none"/>
    <path stroke-dasharray="5,5" stroke-width="2" stroke="#000000" fill="none" d="m85,238a61,18.5 0 0 1123,0"/>
    <path stroke-width="2" stroke="#000000" fill="none" d="m85,238a61,18.5 0 0 0123,0"/>
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" id="svg_13" y2="236" x2="146" y1="82" x1="145"/>
  </g>
</svg>

<script type="text/javascript" >
function change_figure200() {
    var ajout = '<g><line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" id="svg_13" y2="236" x2="146" y1="246" x1="200"/></g>';
    ajout = ajout + '<g><line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" id="svg_13" y2="82" x2="146" y1="92" x1="200"/></g>'
    $("#figure200").html( $("#figure200").html() + ajout );
}
</script>
<svg width="300" height="300" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" id="figure200" onclick="change_figure210()">
<g>
<line x1="0" y1="0" x2="0" y2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line x1="50" y1="0" x2="50" y2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line x1="100" y1="0" x2="100" y2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line x1="150" y1="0" x2="150" y2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line x1="200" y1="0" x2="200" y2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line x1="250" y1="0" x2="250" y2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line x1="300" y1="0" x2="300" y2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line y1="0" x1="0" y2="0" x2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line y1="50" x1="0" y2="50" x2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line y1="100" x1="0" y2="100" x2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line y1="150" x1="0" y2="150" x2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line y1="200" x1="0" y2="200" x2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line y1="250" x1="0" y2="250" x2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line y1="300" x1="0" y2="300" x2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
</g>
</svg>

<script type="text/javascript" >
function change_figure210() {
var ajout = '';
$("#figure").html( $("#figure").html() + ajout );
}
</script>
O 1 2
<svg width="300" height="300" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" id="figure200" onclick="change_figure220()">
<g>
<line x1="1" y1="0" x2="1" y2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line x1="50" y1="0" x2="50" y2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line x1="100" y1="0" x2="100" y2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line x1="150" y1="0" x2="150" y2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line x1="200" y1="0" x2="200" y2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line x1="250" y1="0" x2="250" y2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line x1="300" y1="0" x2="300" y2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line y1="0" x1="0" y2="0" x2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line y1="50" x1="0" y2="50" x2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line y1="100" x1="0" y2="100" x2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line y1="150" x1="0" y2="150" x2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line y1="200" x1="0" y2="200" x2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line y1="250" x1="0" y2="250" x2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line y1="300" x1="0" y2="300" x2="300" stroke="#a0a0a0" stroke-width="1" stroke-dasharray="null" fill="none"/>
<line y1="10" x1="50" y2="300" x2="50" stroke="#000000" stroke-width="3" stroke-dasharray="null" fill="none"/>
<path stroke-width="1" stroke="#000000" fill="#000000" d="M45 10 L 55 10 L 50 0"/>
<line y1="250" x1="0" y2="250" x2="290" stroke="#000000" stroke-width="3" stroke-dasharray="null" fill="none"/>
<path stroke-width="1" stroke="#000000" fill="#000000" d="M290 245 L 290 255 L 300 250"/>
<text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" y="270" x="35">O
<line y1="200" x1="45" y2="200" x2="55" stroke="#000000" stroke-width="3" stroke-dasharray="null" fill="none"/>
<line y1="245" x1="150" y2="255" x2="150" stroke="#000000" stroke-width="3" stroke-dasharray="null" fill="none"/>
<text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" y="210" x="35">1
<text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" y="272" x="149">2
<rect stroke-width="2" stroke="#000000" fill="#FF0000" height="100" width="200" y="150" x="50" style="fill-opacity:0.1;stroke-opacity:0.5;"/>
</g>
</svg>

<script type="text/javascript" >
function change_figure220() {
var ajout = '';
$("#figure").html( $("#figure").html() + ajout );
}
</script>
A B C D S I J K


<svg width="300" height="300" id="figure98" onclick="change_figure98()"> 
  <g> 
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" y2="250" x2="40" y1="250" x1="220"/> 
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" y2="220" x2="100" y1="250" x1="40"/> 
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" y2="220" x2="100" y1="220" x1="280"/> 
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" y2="250" x2="220" y1="220" x1="280"/> 
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" y2="40" x2="150" y1="250" x1="40"/> 
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" y2="40" x2="150" y1="250" x1="220"/> 
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" y2="40" x2="150" y1="220" x1="280"/> 
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" y2="40" x2="150" y1="220" x1="100"/> 
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="269" x="27">A</text> 
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_11" y="268" x="229">B</text> 
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_12" y="229" x="290">C</text> 
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_13" y="240" x="105">D</text> 
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_14" y="30" x="150">S</text> 
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" y2="150" x2="92" y1="150" x1="185"/> 
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" y2="130" x2="126" y1="150" x1="92"/> 
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" y2="130" x2="128" y1="130" x1="217"/> 
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" y2="150" x2="185" y1="130" x1="217"/> 
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_14" y="150" x="80">I</text> 
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_14" y="160" x="200">J</text> 
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_14" y="130" x="230">K</text> 
  </g> 
</svg> 





<svg width="300" height="300" id="figure98" onclick="change_figure98()"> 
  <g> 
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#A4A4A4" y2="250" x2="40" y1="250" x1="220"/> 
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#A4A4A4" y2="220" x2="100" y1="250" x1="40"/> 
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#A4A4A4" y2="220" x2="100" y1="220" x1="280"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#A4A4A4" y2="220" x2="100" y1="220" x1="125"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#A4A4A4" y2="220" x2="160" y1="220" x1="280"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#A4A4A4" y2="250" x2="220" y1="220" x1="280"/> 
    
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#A4A4A4" y2="80" x2="40" y1="80" x1="220"/> 
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#A4A4A4" y2="50" x2="100" y1="80" x1="40"/> 
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#A4A4A4" y2="50" x2="100" y1="50" x1="280"/>

    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#A4A4A4" y2="50" x2="100" y1="50" x1="150"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#A4A4A4" y2="50" x2="180" y1="50" x1="280"/>    
    
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#A4A4A4" y2="80" x2="220" y1="50" x1="280"/> 
    
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" y2="300" x2="120" y1="280" x1="150"/> 
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" y2="20" x2="150" y1="300" x1="120"/> 
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" y2="20" x2="150" y1="0" x1="180"/> 
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" y2="280" x2="150" y1="0" x1="180"/>
    
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" y2="280" x2="150" y1="250" x1="153"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" y2="50" x2="174.5" y1="0" x1="180"/>
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" y2="220" x2="156" y1="80" x1="171"/>
    
    <line fill="none" stroke-dasharray="null" stroke-width="3" stroke="#2E2EFE" y2="220" x2="156" y1="250" x1="125"/>
    <line fill="none" stroke-dasharray="null" stroke-width="3" stroke="#2E2EFE" y2="50" x2="176" y1="80" x1="145"/>
    
	</g>
</svg>



$\mathscr{P}_1$ $\mathscr{P}_2$ $d_1$ $d_2$


<svg width="300" height="300" id="figure98" onclick="change_figure98()"> 
  	<g>
  	 	<polyline points="20,250 80,5 220,5 160,250 20,250"
  			style="fill:#a4a4a4;stroke:#a4a4a4;stroke-width:2;fill-opacity:0.5;" />
  		<polyline points="120,180 80,5 230,5 270,180 120,180"
  			style="fill:#a4a4a4;stroke:#a4a4a4;stroke-width:2;fill-opacity:0.95;" />	
		<line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000" y2="250" x2="0" y1="250" x1="200"/>
  	 	<line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000" y2="5" x2="50" y1="5" x1="250"/>
  	 	<line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000" y2="180" x2="100" y1="180" x1="300"/>
  	 	<foreignObject x='220' y='150' width='20px' height='20px'>$\mathscr{P}_1$</foreignObject>
  	 	<foreignObject x='50' y='220' width='20px' height='20px'>$\mathscr{P}_2$</foreignObject>
  	 	<foreignObject x='200' y='260' width='20px' height='20px'>$d_1$</foreignObject>
  	 	<foreignObject x='280' y='190' width='20px' height='20px'>$d_2$</foreignObject>
	</g>
</svg>




<svg width="300" height="300" id="figure98" onclick="change_figure98()"> 
  	<g>
  		<line fill="none" stroke-dasharray="null" stroke-width="1" stroke="#000" x2="140" y2="50" x1="140" y1="300"/>
  		<polyline points="5,220 220,220 280,180 65,180 5,220"
  			style="fill:#a4a4a4;stroke:#a4a4a4;stroke-width:2;fill-opacity:0.6;" />	
		<line fill="none" stroke-dasharray="null" stroke-width="1" stroke="#000" x2="5" y2="220" x1="280" y1="180"/>
  	 	<line fill="none" stroke-dasharray="null" stroke-width="1" stroke="#000" x2="65" y2="180" x1="220" y1="220"/>
  	 	<line fill="none" stroke-dasharray="null" stroke-width="1" stroke="#000" x2="140" y2="50" x1="140" y1="200"/>
  	 	<line fill="none" stroke-dasharray="null" stroke-width="1" stroke="#000" x2="140" y2="220" x1="140" y1="300"/>
	</g>
</svg>


B C D A F G H E $\vec{i}$ $\vec{j}$ $\vec{k}$


<svg width="300" height="300">
 	<defs>
   	 <marker id="arrow" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth">
      		<path d="M0,0 L0,6 L9,3 z" fill="#000" />
    	</marker>
  	</defs>
  <g> 
    <rect stroke-width="2" stroke="#000000" fill="none" id="svg_1" height="180" width="180" y="70" x="40"/> 
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" id="svg_2" y2="40" x2="100" y1="70" x1="40"/> 
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" id="svg_3" y2="40" x2="280" y1="70" x1="220"/> 
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" id="svg_4" y2="220" x2="280" y1="250" x1="220"/> 
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" id="svg_5" y2="220" x2="280" y1="40" x1="280"/> 
    <line fill="none" stroke-dasharray="null" stroke-width="2" stroke="#000000" id="svg_6" y2="40" x2="100" y1="40" x1="280"/> 
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" id="svg_7" y2="220" x2="100" y1="40" x1="100"/> 
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" id="svg_8" y2="220" x2="100" y1="250" x1="40"/> 
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" id="svg_9" y2="220" x2="100" y1="220" x1="280"/> 
    
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="269" x="27">B</text> 
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_11" y="268" x="229">C</text> 
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_12" y="229" x="290">D</text> 
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_13" y="240" x="105">A</text> 
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_14" y="76" x="23">F</text> 
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_15" y="83" x="235">G</text> 
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_16" y="35" x="286">H</text> 
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_17" y="30" x="105">E</text> 
    
    <circle cx="100" cy="40" r="3" stroke="black" stroke-width="3" fill="black" />
    <circle cx="40" cy="70" r="3" stroke="black" stroke-width="3" fill="black" />
    <circle cx="280" cy="40" r="3" stroke="black" stroke-width="3" fill="black" />
    <circle cx="220" cy="70" r="3" stroke="black" stroke-width="3" fill="black" />
    <circle cx="280" cy="220" r="3" stroke="black" stroke-width="3" fill="black" />
    <circle cx="220" cy="250" r="3" stroke="black" stroke-width="3" fill="black" />
    <circle cx="100" cy="220" r="3" stroke="black" stroke-width="3" fill="black" />
    <circle cx="40" cy="250" r="3" stroke="black" stroke-width="3" fill="black" />
    
    <line x1="100" y1="220" x2="100" y2="150" stroke="#000" stroke-width="2" marker-end="url(#arrow)" />
    <line x1="100" y1="220" x2="160" y2="220" stroke="#000" stroke-width="2" marker-end="url(#arrow)" />
    <line x1="100" y1="220" x2="82" y2="229" stroke="#000" stroke-width="2" marker-end="url(#arrow)" />
    
    <foreignObject x='75' y='200' width='20px' height='20px'>$\vec{i}$</foreignObject>
    <foreignObject x='130' y='190' width='20px' height='20px'>$\vec{j}$</foreignObject>
    <foreignObject x='75' y='150' width='20px' height='20px'>$\vec{k}$</foreignObject>
  </g> 
</svg> 


A B C H


<svg width="300" height="300" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" id="figure99" onclick="change_figure99()"> 
  <g> 
    <line fill="none" stroke-width="2" stroke="#000000" id="svg_1" y2="208" x2="36" y1="62" x1="138"/> 
    <line fill="none" stroke-width="2" stroke="#000000" id="svg_2" y2="251" x2="165" y1="208" x1="36"/> 
    <line fill="none" stroke-width="2" stroke="#000000" id="svg_3" y2="62" x2="138" y1="251" x1="165"/> 
    <line fill="none" stroke-dasharray="5,5" stroke-width="2" stroke="#000000" id="svg_6" y2="251" x2="165" y1="180" x1="54"/>
    <line fill="none" stroke-width="1" stroke="#000000" id="svg_3" y2="171" x2="63" y1="180" x1="76"/>
    <line fill="none" stroke-width="1" stroke="#000000" id="svg_3" y2="190" x2="69" y1="180" x1="76"/>
    

    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_7" y="50" x="134">A</text> 
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_8" y="217" x="25">B</text> 
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_9" y="276" x="166">C</text> 
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="20" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_9" y="180" x="40">H</text>
  </g> 
</svg>


$\vec{n}$ A M


<svg width="300" height="300" id="figure98" onclick="change_figure98()"> 
        <defs>
   	 <marker id="arrow" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth">
      		<path d="M0,0 L0,6 L9,3 z" fill="#000" />
    	</marker>
  	</defs>
  	<g>
  		
  		<polyline points="5,220 220,220 280,180 65,180 5,220"
  			style="fill:#a4a4a4;stroke:#a4a4a4;stroke-width:2;fill-opacity:0.6;" />	

		<line fill="none" stroke-dasharray="null" stroke-width="1" stroke="#000" x2="80" y2="208" x1="141" y1="200"/>
  	 	<line fill="none" stroke-dasharray="null" stroke-width="1" stroke="#000" x2="130" y2="202" x1="130" y1="190"/>
  	 	<line fill="none" stroke-dasharray="null" stroke-width="1" stroke="#000" x2="130" y2="190" x1="140" y1="188.5"/>
  	 	
            <line x1="140" y1="200" x2="140" y2="100" stroke="#000" stroke-width="1" marker-end="url(#arrow)" />
            <circle cx="80" cy="208" r="1" stroke="black" stroke-width="3" fill="black" />
  	    <circle cx="140" cy="200" r="1" stroke="black" stroke-width="3" fill="black" />
            <foreignObject x='140' y='150' width='20px' height='20px'>$\vec{n}$</foreignObject>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="208" x="150">A</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="213" x="68">M</text>
	</g>
</svg>


$\vec{n}$ $\mathscr{D}$ A H


<svg width="300" height="300" id="figure98" onclick="change_figure98()"> 
        <defs>
   	 <marker id="arrow" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth">
      		<path d="M0,0 L0,6 L9,3 z" fill="#000" />
    	</marker>
  	</defs>
  	<g>
  	   <line fill="none" stroke-dasharray="null" stroke-width="1" stroke="#000" x2="80" y2="50" x1="80" y1="280"/>	
  	   <polyline points="5,220 220,220 280,180 65,180 5,220"
  			style="fill:#a4a4a4;stroke:#a4a4a4;stroke-width:2;fill-opacity:0.6;" />	
           <line fill="none" stroke-dasharray="null" stroke-width="1" stroke="#000" x2="80" y2="50" x1="80" y1="208"/>
	   <line fill="none" stroke-dasharray="null" stroke-width="1" stroke="#000" x2="80" y2="220" x1="80" y1="280"/>
  	   
  	 	
            <line x1="140" y1="200" x2="140" y2="100" stroke="#000" stroke-width="1" marker-end="url(#arrow)" />
            <circle cx="80" cy="208" r="1" stroke="black" stroke-width="3" fill="black" />
  	    <circle cx="80" cy="100" r="1" stroke="black" stroke-width="3" fill="black" />
            <foreignObject x='140' y='150' width='20px' height='20px'>$\vec{n}$</foreignObject>
            <foreignObject x='50' y='260' width='20px' height='20px'>$\mathscr{D}$</foreignObject>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="105" x="68">A</text>
    <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_10" y="213" x="68">H</text>
	</g>
</svg>




<svg width="300" height="300" id="figure98" onclick="change_figure98()"> 
  	<g>
  		<line fill="none" stroke-dasharray="null" stroke-width="1" stroke="#000" x2="140" y2="50" x1="140" y1="300"/>
  		<polyline points="5,220 220,220 280,180 65,180 5,220"
  			style="fill:#a4a4a4;stroke:#a4a4a4;stroke-width:2;fill-opacity:0.6;" />	
		<line fill="none" stroke-dasharray="null" stroke-width="1" stroke="#000" x2="5" y2="220" x1="280" y1="180"/>
  	 	<line fill="none" stroke-dasharray="null" stroke-width="1" stroke="#000" x2="65" y2="180" x1="220" y1="220"/>
  	 	<line fill="none" stroke-dasharray="null" stroke-width="1" stroke="#000" x2="140" y2="50" x1="140" y1="200"/>
  	 	<line fill="none" stroke-dasharray="null" stroke-width="1" stroke="#000" x2="140" y2="220" x1="140" y1="300"/>
	</g>
</svg>


A M B


<svg width="300" height="300" id="figure98" onclick="change_figure98()"> 
  	<g>
  	    <line fill="none" stroke-dasharray="null" stroke-width="1" stroke="#000" x2="5" y2="150" x1="200" y1="150"/>
  	    <polyline points="120,25 120,220 80,280 80,85 120,25"
  			style="fill:#a4a4a4;stroke:#a4a4a4;stroke-width:2;fill-opacity:0.6;" />	
		
  	    <circle cx="5" cy="150" r="1" stroke="black" stroke-width="3" fill="black" />
  	    <circle cx="100" cy="150" r="1" stroke="black" stroke-width="3" fill="black" />
  	    <circle cx="200" cy="150" r="1" stroke="black" stroke-width="3" fill="black" />
            <line fill="none" stroke-dasharray="null" stroke-width="1" stroke="#000" x2="5" y2="150" x1="80" y1="150"/>
            <line fill="none" stroke-dasharray="null" stroke-width="1" stroke="#000" x2="100" y2="150" x1="200" y1="150"/>
            <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_17" y="170" x="5">A</text> 
            <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_17" y="170" x="102">M</text>
            <text xml:space="preserve" text-anchor="middle" font-family="serif" font-size="15" stroke-dasharray="5,5" stroke-width="0" stroke="#000000" fill="#000000" id="svg_17" y="170" x="200">B</text>
	</g>
</svg>


$\mathscr{P_1}$ $\overrightarrow{n_1}$ $\mathscr{P_2}$ $\overrightarrow{n_2}$


<svg width="300" height="290" id="figure98" onclick="change_figure98()"> 
        <defs>
   	 <marker id="arrow" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth">
      		<path d="M0,0 L0,6 L9,3 z" fill="#000" />
    	</marker>
  	</defs>
  	<g>	
  	   <polyline points="5,120 200,120 260,80 65,80 5,120"
  			style="fill:#a4a4a4;stroke:#a4a4a4;stroke-width:2;fill-opacity:0.6;" />	

           <line x1="120" y1="100" x2="120" y2="20" stroke="#000" stroke-width="1" marker-end="url(#arrow)" />
            <foreignObject x='40' y='100' width='20px' height='50px'>$\mathscr{P_1}$</foreignObject>
            <foreignObject x='120' y='50' width='20px' height='50px'>$\overrightarrow{n_1}$</foreignObject>
            
            
            <polyline points="25,280 220,280 280,240 85,240 25,280"
  			style="fill:#a4a4a4;stroke:#a4a4a4;stroke-width:2;fill-opacity:0.6;" />	

           <line x1="160" y1="260" x2="160" y2="180" stroke="#000" stroke-width="1" marker-end="url(#arrow)" />
            <foreignObject x='60' y='260' width='20px' height='50px'>$\mathscr{P_2}$</foreignObject>
            <foreignObject x='160' y='210' width='20px' height='50px'>$\overrightarrow{n_2}$</foreignObject>

	</g>
</svg>


$\mathscr{P_1}$ $\overrightarrow{n_1}$ $\mathscr{P_2}$ $\overrightarrow{n_2}$


<svg width="300" height="350" id="figure98" onclick="change_figure98()"> 
        <defs>
   	 <marker id="arrow" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth">
      		<path d="M0,0 L0,6 L9,3 z" fill="#000" />
    	</marker>
  	</defs>
  	<g>	
  	   <polyline points="5,120 200,120 260,80 65,80 5,120"
  			style="fill:#a4a4a4;stroke:#a4a4a4;stroke-width:2;fill-opacity:0.6;" />	

           <line x1="120" y1="100" x2="120" y2="20" stroke="#000" stroke-width="1" marker-end="url(#arrow)" />
            <foreignObject x='40' y='100' width='20px' height='50px'>$\mathscr{P_1}$</foreignObject>
            <foreignObject x='120' y='50' width='20px' height='50px'>$\overrightarrow{n_1}$</foreignObject>
            
            
            <line x1="120" y1="240" x2="60" y2="240" stroke="#000" stroke-width="1" marker-end="url(#arrow)" />
            <polyline points="140,125 140,280 100,340 100,185 140,125"
  			style="fill:#a4a4a4;stroke:#a4a4a4;stroke-width:2;fill-opacity:0.6;" />		

            <line x1="100" y1="240" x2="60" y2="240" stroke="#000" stroke-width="1" marker-end="url(#arrow)" />
            <foreignObject x='110' y='270' width='20px' height='50px'>$\mathscr{P_2}$</foreignObject>
            <foreignObject x='75' y='210' width='20px' height='50px'>$\overrightarrow{n_2}$</foreignObject>

	</g>
</svg>


$\mathscr{P_1}$ $\overrightarrow{n_1}$ $\mathscr{P_2}$ $\overrightarrow{n_2}$


<svg width="300" height="310" id="figure98" onclick="change_figure98()"> 
        <defs>
   	 <marker id="arrow" markerWidth="10" markerHeight="10" refX="0" refY="3" orient="auto" markerUnits="strokeWidth">
      		<path d="M0,0 L0,6 L9,3 z" fill="#000" />
    	</marker>
  	</defs>
  	<g>	
  	   <polyline points="5,120 200,120 260,80 65,80 5,120"
  			style="fill:#a4a4a4;stroke:#a4a4a4;stroke-width:2;fill-opacity:0.6;" />	

           <line x1="120" y1="100" x2="120" y2="20" stroke="#000" stroke-width="1" marker-end="url(#arrow)" />
            <foreignObject x='40' y='100' width='50px' height='50px'>$\mathscr{P_1}$</foreignObject>
            <foreignObject x='120' y='50' width='50px' height='50px'>$\overrightarrow{n_1}$</foreignObject>
            
            
            <polyline points="25,280 220,260 280,220 85,240 25,280"
  			style="fill:#a4a4a4;stroke:#a4a4a4;stroke-width:2;fill-opacity:0.6;" />	

           <line x1="150" y1="255" x2="140" y2="180" stroke="#000" stroke-width="1" marker-end="url(#arrow)" />
            <foreignObject x='60' y='255' width='50px' height='50px'>$\mathscr{P_2}$</foreignObject>
            <foreignObject x='151' y='200' width='50px' height='50px'>$\overrightarrow{n_2}$</foreignObject>

	</g>
</svg>