簡體   English   中英

Safari中的遮罩形狀上的SVG過濾器未呈現

[英]SVG Filter on masking shape in Safari not rendering

我正在使用蒙版從SVG形狀中切出一個圓圈。 我要使用具有羽狀邊緣的聚光燈效果,因此我正在使用高斯模糊濾鏡在Firefox和Chrome中實現此效果,但是由於某些原因,我無法使用Safari來渲染濾鏡。 這可能與蒙版定義中的形狀有關嗎? 我讀到Webkit曾經要求設置一個標志來啟用SVG篩選器。 可以嗎?

這是過濾器定義:

<defs>
    <filter id="blur_alpha" x="-1" y="-1" width="100" height="100" filterUnits="objectBoundingBox">
        <feGaussianBlur result="blur_alpha_blur" in="SourceAlpha" stdDeviation="10"/>
    </filter>
</defs>

這是實現它的SVG:

<svg version="1.1" width="360" height="515" viewBox="0 0 360 515">
    <defs>
        <mask id="circle_mask0" x="0" y="0" width="360" height="515" maskUnits="userSpaceOnUse">
            <rect x="0" y="0" width="360" height="515" stroke-width="0" fill="white" opacity="0.8"/>
            <circle cx="514" cy="492" r="129.6" stroke-width="0" fill="black" opacity="1" filter="url(#blur_alpha)"/>
        </mask>
    </defs>
    <rect x="0" y="0" width="360" height="515" stroke-width="0" mask="url(#circle_mask0)" opacity="1"/>
</svg>

我已經嘗試過在同一SVG中定義過濾器,更改過濾器單位等。這是查看它的鏈接。 在Chrome / Firefox中然后在Safari中嘗試: soundandtheshadow.com

更新資料

在Safari中搜索SVG過濾器的其他應用程序時,我注意到沒有過濾器正在渲染。 顯然,這是我的Safari版本中的錯誤,我通過瀏覽器提交了錯誤報告。 如果有人對如何獲得更多關注有更好的建議,請告訴我。 如果有人有解決方法,我將保持開放狀態!

這不是錯誤。 在當前版本的Safari中,只是未實現SVG篩選器(或者,在Webkit中構建時沒有過濾器支持)。

該表可能對您有用: http : //caniuse.com/svg-filters

UPD :在獲得答案的那一刻,Safari 6(支持SVG篩選器)已經停產了一段時間。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM