Я могу добавить тень кругу или квадрату.
Но возможно ли проделать тоже самое с полигонами?
<svg>
<defs>
<filter id="drop-shadow" width="150%" height="150%">
<feGaussianBlur in="SourceAlpha" stdDeviation="3" result="blur"/>
<feOffset in="blur" dx="2" dy="2" result="offsetBlur"/>
<feMerge>
<feMergeNode in="offsetBlur"/>
<feMergeNode in="SourceGraphic"/>
</feMerge>
</filter>
</defs>
<rect x="75" y="75" width="50" height="50" fill="cyan"
filter="url(#drop-shadow)"/>
<rect x="75" y="25" width="50" height="50" fill="gold"
filter="url(#drop-shadow)"/>
<rect x="25" y="75" width="50" height="50" fill="lime"
filter="url(#drop-shadow)"/>
<rect x="25" y="25" width="50" height="50" fill="red"
filter="url(#drop-shadow)"/>
<g filter="url(#drop-shadow)" transform="translate(150,0)">
<rect x="75" y="75" width="50" height="50" fill="cyan"/>
<rect x="75" y="25" width="50" height="50" fill="gold"/>
<rect x="25" y="75" width="50" height="50" fill="lime"/>
<rect x="25" y="25" width="50" height="50" fill="red"/>
</g>
</svg>
<svg viewBox="0 0 10 10" xmlns="http://www.w3.org/2000/svg">
<defs>
<filter id="shadow">
<feDropShadow dx="0.2" dy="0.4" stdDeviation="0.2"/>
</filter>
</defs>
<circle cx="50%" cy="50%" r="4"
style="fill:pink; filter:url(#shadow);"/>
</svg>
UPD: спасибо за помощь, разобрался.
<div>
<svg class="map-2up-2" viewBox="0 0 2000 1125" xmlns="http://www.w3.org/2000/svg">
<polygon points="708,765,819,692,888,710,932,683,916,630,845,623,778,634,732,650,706,708" fill="#999" />
</svg>
</div>
<div>
<svg class="map-2up-2" viewBox="0 0 2000 1125" xmlns="http://www.w3.org/2000/svg">
<defs>
<filter id="map-2up-2" height="130%">
<feGaussianBlur in="SourceAlpha" stdDeviation="3"/>
<feOffset dx="10" dy="10" result="offsetblur"/>
<feMerge>
<feMergeNode/>
<feMergeNode in="SourceGraphic"/>
</feMerge>
</filter>
</defs>
<polygon points="708,765,819,692,888,710,932,683,916,630,845,623,778,634,732,650,706,708" fill="#999" filter="url(#map-2up-2)" />
</svg>
</div>