SVG阴影得到修剪

我有一个正在剪裁的阴影的SVG刻度图标。我在SO上看到的通常的过滤器偏移方法没有帮助。有什么建议么？SVG阴影得到修剪

<svg version="1.2" baseProfile="tiny" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 
    x="0px" y="0px" width="73.516px" height="55.507px" viewBox="0 0 73.516 55.507" xml:space="preserve"> 

    <filter id="dropShadow" x="-20%" y="-20%" width="200%" height="200%"> 
    <feGaussianBlur in="SourceAlpha" stdDeviation="2" /> 
    <feOffset dx="0" dy="0" /> 
    <feMerge> 
     <feMergeNode /> 
     <feMergeNode in="SourceGraphic" /> 
    </feMerge> 
    </filter> 

    <polygon fill="#F2F2F2" points="61.769,0 29.784,31.987 11.765,13.96 0,25.69 18.034,43.735 18.011,43.761 29.748,55.507 
    73.516,11.75 " filter="url(#dropShadow)"/> 

</svg>

我用Adobe Illustrator生成了这个，然后通过代码添加了阴影。

谢谢！

来源

2013-07-13 Drew Baker

展开过滤区域不会帮助在SVG视图框外绘画。现在，您的复选标记正好绘制在视图框的边缘，因此投影盒会切断投影，而不是过滤器区域。增加你的viewbox的大小，这个世界会很好。

来源

2013-07-14 00:18:16

将SVG的CSS设置为overflow:visible为我工作。

来源

2016-03-16 01:34:32

SVG阴影得到修剪

回答

相关问题