复杂 SVG 中的外部阴影 [jVectorMap 国家/地区]答案

【问题标题】：Outer drop shadow in complex SVG [jVectorMap Countries]复杂 SVG 中的外部阴影 [jVectorMap 国家/地区]
【发布时间】：2015-10-29 02:23:54
【问题描述】：

我在jVectorMap的一些国家添加了阴影。

用于投影的滤镜：

<svg>
  <defs>
    <filter id="f2" x="0" y="0">
      <feOffset result="offOut" in="SourceAlpha" dx="0" dy="0" />
      <feGaussianBlur result="blurOut" in="SourceGraphic" stdDeviation="4"/>
      <feBlend in="SourceGraphic" in2="blurOut" mode="normal" />
    </filter>

    <filter id = "i1">
      <feOffset result="offOut" in="SourceGraphic" dx = "0" dy = "0"/>
      <feColorMatrix result="matrixOut" in="offOut" type="matrix" values="1 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0" />
      <feGaussianBlur result="blurOut" in="matrixOut" stdDeviation="4"/>
      <feBlend in="SourceGraphic" in2="blurOut" mode="normal"/>
    </filter>
  </defs>
</svg>

示例：CodePen

对于大国来说看起来不错。但问题在于小国。 对于小国，阴影在边界周围形成一个正方形（在示例中放大科索沃和奥兰等国家）。

我怎样才能去掉那个方形，让它看起来像其他大国？

【问题讨论】：

标签： css svg jvectormap dropshadow svg-filters

【解决方案1】：

扩大你的过滤区域，你会没事的：

<filter id = "i1" x="-40%" y="-40%" width="180%" height="180%">

为我做。

【讨论】：