Files
nuhodds_fi4/public/svg/soccerfield.svg
T
2026-09-10 18:28:53 +02:00

69 lines
3.2 KiB
XML

<svg xmlns="http://w3.org" viewBox="0 0 700 500" width="100%" height="100%">
<defs>
<!-- Definition für die helleren Rasenstreifen -->
<pattern id="grass-stripes" width="100" height="500" patternUnits="userSpaceOnUse">
<rect x="0" y="0" width="50" height="500" fill="#2d8a4e" />
<rect x="50" y="0" width="50" height="500" fill="#359a58" />
</pattern>
</defs>
<!-- 1. Rasen-Hintergrund mit Streifenmuster -->
<rect width="700" height="500" fill="url(#grass-stripes)" />
<!-- 2. Äußere Spielfeldbegrenzung (Sicherheitsabstand von 25px zum Rand) -->
<!-- Spielfeld-Netto-Maße: 650px Länge x 450px Breite -->
<rect x="25" y="25" width="650" height="450" fill="none" stroke="#ffffff" stroke-width="3" />
<!-- Mittellinie -->
<line x1="350" y1="25" x2="350" y2="475" stroke="#ffffff" stroke-width="3" />
<!-- Anstoßkreis (Radius proportional angepasst: 60px) -->
<circle cx="350" cy="250" r="60" fill="none" stroke="#ffffff" stroke-width="3" />
<!-- Anstoßpunkt -->
<circle cx="350" cy="250" r="4" fill="#ffffff" />
<!-- ================= LINKES SPIELFELDDRITTEL ================= -->
<!-- Strafraum (100px tief, 240px breit, zentriert bei y=250) -->
<rect x="25" y="130" width="100" height="240" fill="none" stroke="#ffffff" stroke-width="3" />
<!-- Torraum / Fünfmeterraum (35px tief, 110px breit) -->
<rect x="25" y="195" width="35" height="110" fill="none" stroke="#ffffff" stroke-width="3" />
<!-- Elfmeterpunkt (75px von der Torlinie entfernt) -->
<circle cx="100" cy="250" r="4" fill="#ffffff" />
<!-- Strafraumkreisbogen (Teilkreis am Strafraum) -->
<path d="M 125,200 A 60,60 0 0,1 125,300" fill="none" stroke="#ffffff" stroke-width="3" />
<!-- Linkes Tor (Außerhalb des Spielfelds gezeichnet) -->
<rect x="5" y="215" width="20" height="70" fill="none" stroke="#ffffff" stroke-width="3" opacity="0.8" />
<!-- ================= RECHTES SPIELFELDDRITTEL ================= -->
<!-- Strafraum (100px tief von rechts, 240px breit) -->
<rect x="575" y="130" width="100" height="240" fill="none" stroke="#ffffff" stroke-width="3" />
<!-- Torraum / Fünfmeterraum (35px tief von rechts, 110px breit) -->
<rect x="640" y="195" width="35" height="110" fill="none" stroke="#ffffff" stroke-width="3" />
<!-- Elfmeterpunkt (75px von der rechten Torlinie entfernt) -->
<circle cx="600" cy="250" r="4" fill="#ffffff" />
<!-- Strafraumkreisbogen (Teilkreis am Strafraum rechts) -->
<path d="M 575,200 A 60,60 0 0,0 575,300" fill="none" stroke="#ffffff" stroke-width="3" />
<!-- Rechtes Tor -->
<rect x="675" y="215" width="20" height="70" fill="none" stroke="#ffffff" stroke-width="3" opacity="0.8" />
<!-- ================= ECKFAHNEN-BÖGEN ================= -->
<!-- Oben Links -->
<path d="M 25,40 A 15,15 0 0,0 40,25" fill="none" stroke="#ffffff" stroke-width="2" />
<!-- Unten Links -->
<path d="M 40,475 A 15,15 0 0,0 25,460" fill="none" stroke="#ffffff" stroke-width="2" />
<!-- Oben Rechts -->
<path d="M 660,25 A 15,15 0 0,0 675,40" fill="none" stroke="#ffffff" stroke-width="2" />
<!-- Unten Rechts -->
<path d="M 675,460 A 15,15 0 0,0 660,475" fill="none" stroke="#ffffff" stroke-width="2" />
</svg>