46 lines
2.8 KiB
XML
46 lines
2.8 KiB
XML
<svg width="420" height="380" xmlns="http://www.w3.org/2000/svg">
|
|
<defs>
|
|
<marker id="arrow-hx" markerWidth="8" markerHeight="6" refX="8" refY="3" orient="auto">
|
|
<path d="M0,0 L8,3 L0,6" fill="#999"/>
|
|
</marker>
|
|
</defs>
|
|
<!-- x-axis (height) — going bottom-left -->
|
|
<line x1="180" y1="300" x2="50" y2="360" stroke="#999" stroke-width="1.5" marker-end="url(#arrow-hx)"/>
|
|
<text x="20" y="375" fill="#999" font-size="12">height</text>
|
|
<!-- y-axis (weight) — going right -->
|
|
<line x1="180" y1="300" x2="400" y2="300" stroke="#999" stroke-width="1.5" marker-end="url(#arrow-hx)"/>
|
|
<text x="390" y="320" fill="#999" font-size="12">weight</text>
|
|
<!-- z-axis (age) — going up -->
|
|
<line x1="180" y1="300" x2="180" y2="40" stroke="#999" stroke-width="1.5" marker-end="url(#arrow-hx)"/>
|
|
<text x="185" y="35" fill="#999" font-size="12">age</text>
|
|
|
|
<!-- Alice: h=[165, 60, 28] -->
|
|
<!-- project: x=180-30=150, y_horiz=300+(-15)=285 shifted right by weight ~60 → ~210, z up by age ~28 -->
|
|
<line x1="180" y1="300" x2="148" y2="312" stroke="#ccc" stroke-width="0.8" stroke-dasharray="3,3"/>
|
|
<line x1="148" y1="312" x2="218" y2="312" stroke="#ccc" stroke-width="0.8" stroke-dasharray="3,3"/>
|
|
<line x1="218" y1="312" x2="218" y2="222" stroke="#ccc" stroke-width="0.8" stroke-dasharray="3,3"/>
|
|
<line x1="180" y1="300" x2="218" y2="222" stroke="#e74c3c" stroke-width="2"/>
|
|
<circle cx="218" cy="222" r="6" fill="#e74c3c"/>
|
|
<text x="228" y="218" fill="#e74c3c" font-size="12" font-weight="bold">Alice (165, 60, 28)</text>
|
|
|
|
<!-- Carol: h=[170, 65, 30] — close to Alice -->
|
|
<line x1="180" y1="300" x2="140" y2="316" stroke="#ccc" stroke-width="0.8" stroke-dasharray="3,3"/>
|
|
<line x1="140" y1="316" x2="230" y2="316" stroke="#ccc" stroke-width="0.8" stroke-dasharray="3,3"/>
|
|
<line x1="230" y1="316" x2="230" y2="206" stroke="#ccc" stroke-width="0.8" stroke-dasharray="3,3"/>
|
|
<line x1="180" y1="300" x2="230" y2="206" stroke="#2ecc71" stroke-width="2"/>
|
|
<circle cx="230" cy="206" r="6" fill="#2ecc71"/>
|
|
<text x="240" y="202" fill="#2ecc71" font-size="12" font-weight="bold">Carol (170, 65, 30)</text>
|
|
|
|
<!-- Bob: h=[185, 85, 45] — far from Alice -->
|
|
<line x1="180" y1="300" x2="120" y2="326" stroke="#ccc" stroke-width="0.8" stroke-dasharray="3,3"/>
|
|
<line x1="120" y1="326" x2="310" y2="326" stroke="#ccc" stroke-width="0.8" stroke-dasharray="3,3"/>
|
|
<line x1="310" y1="326" x2="310" y2="116" stroke="#ccc" stroke-width="0.8" stroke-dasharray="3,3"/>
|
|
<line x1="180" y1="300" x2="310" y2="116" stroke="#3498db" stroke-width="2"/>
|
|
<circle cx="310" cy="116" r="6" fill="#3498db"/>
|
|
<text x="320" y="112" fill="#3498db" font-size="12" font-weight="bold">Bob (185, 85, 45)</text>
|
|
|
|
<!-- origin -->
|
|
<circle cx="180" cy="300" r="3" fill="#333"/>
|
|
<text x="185" y="315" fill="#333" font-size="11">O</text>
|
|
</svg>
|