mirror of
https://github.com/prdlk/leetcode.git
synced 2026-11-02 21:22:43 +00:00
41 lines
2.9 KiB
XML
41 lines
2.9 KiB
XML
|
<svg viewBox="0 0 800 450" xmlns="http://www.w3.org/2000/svg">
|
||
|
|
<!-- Background (REQUIRED) -->
|
||
|
|
<rect width="800" height="450" fill="#f8f9fa" rx="10"/>
|
||
|
|
|
||
|
|
<!-- Title and Subtitle -->
|
||
|
|
<text x="400" y="45" font-family="Arial, sans-serif" font-size="26" font-weight="bold" fill="#2c3e50" text-anchor="middle">Opposite Direction: Bottleneck Elimination</text>
|
||
|
|
<text x="400" y="75" font-family="Arial, sans-serif" font-size="16" fill="#7f8c8d" text-anchor="middle">Container With Most Water: discard the shorter wall.</text>
|
||
|
|
|
||
|
|
<!-- Container -->
|
||
|
|
<g transform="translate(150, 130)">
|
||
|
|
<!-- Walls -->
|
||
|
|
<rect x="0" y="20" width="20" height="150" fill="#3498db" stroke="#2c3e50" stroke-width="2"/>
|
||
|
|
<text x="10" y="10" font-family="Arial, sans-serif" font-size="14" font-weight="bold" fill="#2c3e50" text-anchor="middle">8</text>
|
||
|
|
<polygon points="10,180 5,190 15,190" fill="#3498db"/>
|
||
|
|
<text x="10" y="205" font-family="Arial, sans-serif" font-size="14" font-weight="bold" fill="#3498db" text-anchor="middle">L</text>
|
||
|
|
|
||
|
|
<rect x="50" y="100" width="20" height="70" fill="#94a3b8" stroke="#2c3e50" stroke-width="1"/>
|
||
|
|
<rect x="100" y="130" width="20" height="40" fill="#94a3b8" stroke="#2c3e50" stroke-width="1"/>
|
||
|
|
<rect x="150" y="40" width="20" height="130" fill="#94a3b8" stroke="#2c3e50" stroke-width="1"/>
|
||
|
|
<rect x="200" y="90" width="20" height="80" fill="#94a3b8" stroke="#2c3e50" stroke-width="1"/>
|
||
|
|
<rect x="250" y="20" width="20" height="150" fill="#94a3b8" stroke="#2c3e50" stroke-width="1"/>
|
||
|
|
<rect x="300" y="60" width="20" height="110" fill="#94a3b8" stroke="#2c3e50" stroke-width="1"/>
|
||
|
|
|
||
|
|
<rect x="350" y="110" width="20" height="60" fill="#ef4444" stroke="#2c3e50" stroke-width="2"/>
|
||
|
|
<text x="360" y="100" font-family="Arial, sans-serif" font-size="14" font-weight="bold" fill="#2c3e50" text-anchor="middle">3</text>
|
||
|
|
<polygon points="360,180 355,190 365,190" fill="#ef4444"/>
|
||
|
|
<text x="360" y="205" font-family="Arial, sans-serif" font-size="14" font-weight="bold" fill="#ef4444" text-anchor="middle">R</text>
|
||
|
|
|
||
|
|
<!-- Water -->
|
||
|
|
<rect x="20" y="110" width="330" height="60" fill="#3498db" fill-opacity="0.2"/>
|
||
|
|
|
||
|
|
<!-- Rule -->
|
||
|
|
<g transform="translate(0, 240)">
|
||
|
|
<text x="185" y="0" font-family="Arial, sans-serif" font-size="16" font-weight="bold" fill="#2c3e50" text-anchor="middle">The bottleneck rule:</text>
|
||
|
|
<text x="185" y="25" font-family="Arial, sans-serif" font-size="14" fill="#7f8c8d" text-anchor="middle">Since height[R] < height[L], the only way to find</text>
|
||
|
|
<text x="185" y="45" font-family="Arial, sans-serif" font-size="14" fill="#7f8c8d" text-anchor="middle">a larger area is to discard R and move left.</text>
|
||
|
|
<path d="M 370,110 Q 400,110 400,240" fill="none" stroke="#ef4444" stroke-width="2" stroke-dasharray="5,5"/>
|
||
|
|
<polygon points="400,240 395,230 405,230" fill="#ef4444"/>
|
||
|
|
</g>
|
||
|
|
</g>
|
||
|
|
</svg>
|