Wickedness/heros_web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Replace eighth battle map with hand-painted asset

Browse Source
This commit is contained in:
Wickedness
2026-07-09 14:59:36 +09:00
parent 56e73117f6
commit 4482a7e17a
7 changed files with 83 additions and 101 deletions
Download Patch File Download Diff File Expand all files Collapse all files

96
src/assets/images/battle/eighth-battle-map.svg
View File

@@ -1,96 +0,0 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 2600 2200" width="2600" height="2200">
<defs>
<filter id="grain">
<feTurbulence type="fractalNoise" baseFrequency="0.02" numOctaves="4" seed="821" />
<feColorMatrix type="saturate" values="0.62" />
<feBlend mode="multiply" in2="SourceGraphic" />
</filter>
<pattern id="grass" width="96" height="96" patternUnits="userSpaceOnUse">
<rect width="96" height="96" fill="#61764b" />
<path d="M8 28h28M48 58h30M24 76l20-14M66 18l16 12" stroke="#b7c077" stroke-width="3" opacity="0.24" />
<path d="M12 62l14-24M40 34l13-18M70 80l9-25" stroke="#2f4b2d" stroke-width="2" opacity="0.36" />
<circle cx="20" cy="44" r="3" fill="#7f9258" opacity="0.42" />
<circle cx="68" cy="39" r="4" fill="#3f5f35" opacity="0.32" />
</pattern>
<pattern id="earth" width="104" height="104" patternUnits="userSpaceOnUse">
<rect width="104" height="104" fill="#9b7749" />
<path d="M0 26c38-18 70 12 104-8M0 70c42-18 72 14 104-4" stroke="#c9a069" stroke-width="7" opacity="0.25" />
<path d="M20 86l18-24M62 42l24-16M78 82l14-9" stroke="#57422c" stroke-width="3" opacity="0.34" />
</pattern>
<pattern id="forest" width="126" height="110" patternUnits="userSpaceOnUse">
<rect width="126" height="110" fill="#31482e" />
<circle cx="26" cy="42" r="30" fill="#203823" />
<circle cx="62" cy="32" r="35" fill="#587448" />
<circle cx="96" cy="50" r="31" fill="#294328" />
<circle cx="52" cy="82" r="27" fill="#69844f" />
<path d="M14 62c34 18 74 16 104-8M36 26c22 18 54 16 72-6" stroke="#142615" stroke-width="5" opacity="0.36" />
</pattern>
<pattern id="hill" width="132" height="98" patternUnits="userSpaceOnUse">
<rect width="132" height="98" fill="#77704b" />
<path d="M-10 84c48-62 92-82 134-64c36 15 56 44 74 80" fill="#55543a" opacity="0.72" />
<path d="M18 76c36-40 72-50 108-32" fill="none" stroke="#aa9d66" stroke-width="10" opacity="0.3" />
<path d="M40 36l30 20M82 22l22 22" stroke="#393828" stroke-width="4" opacity="0.34" />
</pattern>
<linearGradient id="river" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#61a4bd" />
<stop offset="0.48" stop-color="#2c6687" />
<stop offset="1" stop-color="#17384f" />
</linearGradient>
<linearGradient id="wall" x1="0" y1="0" x2="0" y2="1">
<stop offset="0" stop-color="#907a5f" />
<stop offset="1" stop-color="#493728" />
</linearGradient>
<linearGradient id="roof" x1="0" y1="0" x2="0" y2="1">
<stop offset="0" stop-color="#d79a41" />
<stop offset="1" stop-color="#7a4d1d" />
</linearGradient>
</defs>
<rect width="2600" height="2200" fill="url(#grass)" />
<g filter="url(#grain)">
<path d="M-80 2020C210 1740 386 1542 604 1322C836 1086 1056 1018 1260 1014C1508 1008 1740 888 2040 708C2268 570 2440 484 2680 438" fill="none" stroke="#a77e4d" stroke-width="272" stroke-linecap="round" opacity="0.96" />
<path d="M-80 2020C210 1740 386 1542 604 1322C836 1086 1056 1018 1260 1014C1508 1008 1740 888 2040 708C2268 570 2440 484 2680 438" fill="none" stroke="url(#earth)" stroke-width="178" stroke-linecap="round" opacity="0.96" />
<path d="M300 2220C350 1830 304 1600 430 1382C560 1158 860 1110 1160 1028C1446 950 1788 764 2180 458" fill="none" stroke="#a77e4d" stroke-width="190" stroke-linecap="round" opacity="0.9" />
<path d="M300 2220C350 1830 304 1600 430 1382C560 1158 860 1110 1160 1028C1446 950 1788 764 2180 458" fill="none" stroke="url(#earth)" stroke-width="114" stroke-linecap="round" opacity="0.86" />
<path d="M1460 -80c-88 250-58 420 72 552c158 160 194 350 106 568c-76 190-52 354 72 492c128 142 170 326 88 594" fill="none" stroke="#173c52" stroke-width="280" stroke-linecap="round" opacity="0.96" />
<path d="M1460 -80c-88 250-58 420 72 552c158 160 194 350 106 568c-76 190-52 354 72 492c128 142 170 326 88 594" fill="none" stroke="url(#river)" stroke-width="184" stroke-linecap="round" opacity="0.98" />
<path d="M1508 146c36 132 48 250-16 384M1638 782c88 108 102 238 34 386M1808 1560c58 108 68 216 24 332" fill="none" stroke="#c0eef5" stroke-width="14" opacity="0.34" />
<path d="M-40 40c260-76 518-42 760 106c40 146-54 282-276 408c-238-22-402-104-492-250Z" fill="url(#forest)" opacity="0.84" />
<path d="M520 320c236-98 474-70 710 78c14 152-88 268-306 346c-246-32-382-170-404-424Z" fill="url(#forest)" opacity="0.82" />
<path d="M18 762c314-118 610-64 872 156c-70 226-330 350-774 366C-16 1118-42 950 18 762Z" fill="url(#forest)" opacity="0.84" />
<path d="M1800 1710c260-96 520-66 760 88v360c-298 76-572 18-820-176c-50-112-30-202 60-272Z" fill="url(#forest)" opacity="0.82" />
<path d="M910 1540c236-84 432-58 590 72c-42 220-190 366-448 438c-148-76-206-246-142-510Z" fill="url(#hill)" opacity="0.84" />
<path d="M2240 760c150-38 286-12 410 82v464c-170 64-322 36-454-82c-58-160-42-314 44-464Z" fill="url(#hill)" opacity="0.86" />
<g transform="translate(2020 230)">
<rect x="-46" y="-26" width="520" height="318" rx="20" fill="#241d16" opacity="0.55" />
<rect x="0" y="0" width="450" height="260" rx="16" fill="url(#wall)" />
<rect x="42" y="50" width="366" height="170" fill="#765f43" stroke="#241d15" stroke-width="12" />
<path d="M42 50h366M42 220h366M42 50v170M408 50v170" stroke="#35291e" stroke-width="10" />
<rect x="82" y="104" width="74" height="84" fill="#98704a" />
<rect x="198" y="78" width="88" height="110" fill="#9e7650" />
<rect x="330" y="104" width="58" height="84" fill="#8c6846" />
<path d="M62 104l58-48l62 48M184 78l60-52l70 52M318 104l42-38l54 38" fill="url(#roof)" stroke="#302316" stroke-width="9" />
<path d="M220 188v-60h46v60" fill="#1f1712" />
</g>
<g transform="translate(760 1220)">
<rect x="0" y="0" width="230" height="130" rx="10" fill="#6d563b" stroke="#2a2119" stroke-width="10" />
<path d="M-16 12L116-74l132 86Z" fill="url(#roof)" stroke="#342313" stroke-width="10" />
<path d="M42 130v-58h46v58M140 130v-70h46v70" fill="#2a2119" opacity="0.8" />
</g>
<g transform="translate(1710 770)">
<rect x="0" y="0" width="220" height="126" rx="10" fill="#6d563b" stroke="#2a2119" stroke-width="10" />
<path d="M-14 14L110-62l128 76Z" fill="url(#roof)" stroke="#342313" stroke-width="10" />
<path d="M78 126v-56h52v56" fill="#2a2119" opacity="0.8" />
</g>
<g transform="translate(60 1630)">
<rect x="0" y="0" width="315" height="230" rx="16" fill="#4f5c53" stroke="#222820" stroke-width="14" />
<path d="M20 56h270M20 116h270M20 176h270M74 20v190M154 20v190M234 20v190" stroke="#263124" stroke-width="9" opacity="0.68" />
<rect x="72" y="-34" width="168" height="76" fill="url(#roof)" stroke="#2c2115" stroke-width="10" />
</g>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 6.7 KiB

BIN
src/assets/images/battle/eighth-battle-map.webp Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1009 KiB

2
src/game/data/battleMapAssets.ts
View File

@@ -1,4 +1,4 @@
import eighthBattleMapUrl from '../../assets/images/battle/eighth-battle-map.svg';
import eighthBattleMapUrl from '../../assets/images/battle/eighth-battle-map.webp';
import eighteenthBattleMapUrl from '../../assets/images/battle/eighteenth-battle-map.svg';
import eleventhBattleMapUrl from '../../assets/images/battle/eleventh-battle-map.svg';
import fiftiethBattleMapUrl from '../../assets/images/battle/fiftieth-battle-map.svg';