SVG與面料JS解析器

我使用加載SVG的文本對齊問題，當加載到SVG的文本被擡高，而不是作爲集生產時，可以垂直排列在畫布下面SVG與面料JS解析器

fabric.loadSVGFromURL

然而

SVG。

SVG的代碼如下：導致瀏覽器

<?xml version="1.0" encoding="utf-8"?> 
<!-- Generator: Adobe Illustrator 17.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> 
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"> 
    <svg version="1.1" 
id="Layer_1" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" 
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="62.8 -28.2 502.6 480" 
enable-background="new 62.8 -28.2 502.6 480" xml:space="preserve"> 
    <g id="Layer-border"> 
     <path id="border" fill="#363F5B" d="M62.8-28.2v480h502.6v-480H62.8L62.8-28.2z"/> 
    </g> 
    <g id="Layer-main"> 
     <rect id="main" x="72" y="-19.2" fill="#BF4D9C" width="484.9" height="463.1"/> 
    </g> 
    <g id="Layer-text"> 
     <text transform="matrix(1 0 0 1 79.5781 339.4394)" fill="#FFFFFF" font-family="'ApexLake-Regular'" font-size="427.7094">K</text> 
    </g> 
</svg>

鏈接：導致https://db.tt/A2VCCfhm

鏈接加載到畫布時：https://db.tt/RqNeO3Ku

來源

2014-11-06 Dan Beck

我不知道，如果你是在github上@rocknpivot。只爲具有最新版本的FabricJs的記錄，此對齊問題已解決。這是2014年11月5日糾正的字體大小的1/4的錯位。無論如何，在發佈的問題中，用戶可以看到用特定字體呈現的美麗「K」字母。字體不存在於您發佈的SVG中，因此此svg將永遠不會呈現爲您的屏幕截圖。

link:http://jsfiddle.net/asturur/vwq7h766/4/

這裏是一個更工作例子反正。您會看到一個略微偏左的偏移錯誤，但我認爲自創建小提琴以來，字體中的內容發生了變化，我沒有更多的原始文件無法再現它。

這裏工作小提琴

https://cloud.githubusercontent.com/assets/1194048/4953012/586b3af8-667b-11e4-93ff-9542f5d61b3d.png

來源

2014-11-12 13:26:26 AndreaBogazzi

耶的截圖這就是我，忘了在這裏更新！再次感謝您的幫助，我可以確認一切正常 – 2014-11-12 19:22:29

SVG與面料JS解析器

回答

相關問題