44 lines
2.5 KiB
XML
44 lines
2.5 KiB
XML
<svg width="380" height="170" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<marker id="bt-arr" markerWidth="7" markerHeight="5" refX="7" refY="2.5" orient="auto">
|
|
<path d="M0,0 L7,2.5 L0,5" fill="#999"/>
|
|
</marker>
|
|
<marker id="bt-r" markerWidth="7" markerHeight="5" refX="7" refY="2.5" orient="auto">
|
|
<path d="M0,0 L7,2.5 L0,5" fill="#e74c3c"/>
|
|
</marker>
|
|
<marker id="bt-b" markerWidth="7" markerHeight="5" refX="7" refY="2.5" orient="auto">
|
|
<path d="M0,0 L7,2.5 L0,5" fill="#3498db"/>
|
|
</marker>
|
|
</defs>
|
|
|
|
<!-- Left: standard basis -->
|
|
<text x="70" y="14" text-anchor="middle" fill="#333" font-size="11" font-weight="bold">Before</text>
|
|
<line x1="20" y1="150" x2="150" y2="150" stroke="#ccc" stroke-width="1" marker-end="url(#bt-arr)"/>
|
|
<line x1="20" y1="150" x2="20" y2="25" stroke="#ccc" stroke-width="1" marker-end="url(#bt-arr)"/>
|
|
<circle cx="20" cy="150" r="3" fill="#333"/>
|
|
<!-- i hat -->
|
|
<line x1="20" y1="150" x2="88" y2="150" stroke="#e74c3c" stroke-width="2.5" marker-end="url(#bt-r)"/>
|
|
<text x="58" y="145" fill="#e74c3c" font-size="11" font-weight="bold">i</text>
|
|
<!-- j hat -->
|
|
<line x1="20" y1="150" x2="20" y2="82" stroke="#3498db" stroke-width="2.5" marker-end="url(#bt-b)"/>
|
|
<text x="12" y="112" fill="#3498db" font-size="11" font-weight="bold">j</text>
|
|
|
|
<!-- Arrow -->
|
|
<text x="185" y="85" text-anchor="middle" fill="#333" font-size="18">→</text>
|
|
<text x="185" y="102" text-anchor="middle" fill="#666" font-size="10">A =</text>
|
|
<text x="185" y="115" text-anchor="middle" fill="#666" font-size="10">[col1 | col2]</text>
|
|
|
|
<!-- Right: transformed basis -->
|
|
<text x="310" y="14" text-anchor="middle" fill="#333" font-size="11" font-weight="bold">After</text>
|
|
<line x1="230" y1="150" x2="370" y2="150" stroke="#ccc" stroke-width="1" marker-end="url(#bt-arr)"/>
|
|
<line x1="230" y1="150" x2="230" y2="25" stroke="#ccc" stroke-width="1" marker-end="url(#bt-arr)"/>
|
|
<circle cx="230" cy="150" r="3" fill="#333"/>
|
|
<!-- transformed i (column 1, e.g. [2,1]) -->
|
|
<line x1="230" y1="150" x2="350" y2="100" stroke="#e74c3c" stroke-width="2.5" marker-end="url(#bt-r)"/>
|
|
<text x="305" y="115" fill="#e74c3c" font-size="11" font-weight="bold">Ai</text>
|
|
<!-- transformed j (column 2, e.g. [1,2]) -->
|
|
<line x1="230" y1="150" x2="280" y2="50" stroke="#3498db" stroke-width="2.5" marker-end="url(#bt-b)"/>
|
|
<text x="248" y="85" fill="#3498db" font-size="11" font-weight="bold">Aj</text>
|
|
|
|
<text x="185" y="165" text-anchor="middle" fill="#666" font-size="10">columns of A = where i and j land</text>
|
|
</svg> |