Chrome mangling文字剪輯路徑的解決方法？

Question

任何人都可以提出一種方式讓Chrome瀏覽器不會在小文本被用作剪輯路徑時破壞文本嗎？

我正在使用svg與文本剪輯路徑。在Windows 7上使用Chrome 38（& 37）也會在文本用作剪輯路徑時壓縮文本，但僅當文本小於特定大小時纔會壓縮文本。以前我可以通過使用svg字體來解決問題，但Chrome 38取消了對svg字體的支持。

即使是像下面一個簡單的SVG顯示問題：

<div id="container"> 
 
    <svg id="text_svg" xmlns="http://www.w3.org/2000/svg" width="500" height="403"> 
 
    <defs> 
 
     <clipPath id="Si1jwwg9g5"> 
 
     <text x="0" y="20" fill="#0000ff" style="font-family: Arial; font-size: 20px;">Testing</text> 
 
     </clipPath> 
 
    </defs> 
 
    <g clip-path="url('#Si1jwwg9g5')"> 
 
     <rect x="0" y="0" width="500" height="403" fill="#008000"></rect> 
 
    </g> 
 
    </svg> 
 
</div>

對於非Windows/Chrome用戶，這裏的錯位文字看起來是這樣的：

使文字更大，例如40px而不是20px，可以解決問題。

上面的代碼片段在Safari，IE和Firefox上正常工作。

我也試過使用viewbox，問題仍然存在。我也嘗試使用文本作爲掩碼而不是剪輯路徑，問題仍然存在。

Answer 1

我遇到了應用了濾鏡的文本問題。在Chrome 39中修復了此問題： https://code.google.com/p/chromium/issues/detail?id=425530

因此請嘗試beta channel for Chrome 39，看看是否解決了您的問題。