加載外部SVG文件

能否請您分享工作示例如何：加載外部SVG文件

負載的外部SVG文件與其引用資源（腳本/風格）
負載的SVG一起來自同一個對象標籤的文檔主機文檔

使用jQuery SVG插件？我在項目頁面的源代碼中遇到麻煩：例如

var SVG = $("#wrapper").svg('get'); 
SVG.load('external.svg', { addTo:true });

抱怨SVG容器未定義。在SVG文件中引用

下工作，但資源不加載：

$("#wrapper").svg({ 
    onLoad: function(){ 
     var svg = $("#wrapper").svg('get'); 
     svg.load('external.svg', {addTo:true}); 
    }, 
    settings: {} 
}

這些都是外部CSS樣式表和腳本。鏈接正確顯示圖像：

<!-- not applied --> 
<?xml-stylesheet href="styles/common.css" type="text/css"?> 
<svg> 
    <!-- not loaded --> 
    <script xlink:href="scripts/common.js" /> 
    <!-- o.k. --> 
    <image xlink:href="images/test.png" /> 
</svg>

來源

2012-05-24 jpullmann

什麼樣的資源是你失蹤？如果它是位圖，你可以將它們轉換爲內嵌圖像（'data：//'）嗎？如果您可以提供一個不適合您的SVG文件的小樣本，那將是理想的。 – halfer

@halfer謝謝你的評論，我已經添加了一個例子。一個訪問通過對象加載的SVG文檔的解決方案（或者由於可腳本化），嵌入標籤將繞過這些問題。顯然[插件頁面]（http://keith-wood.name/svg.html）沒有提到這種方法。 – jpullmann

這個腳本似乎爲我工作：

function drawIntro(svg) { 

    svg.load('lion.svg', {addTo: true, changeSize: true}); 

} 
$().ready(function(){ 
$('#svgphone').svg({onLoad: drawIntro}); 

}); //$().ready(function()

來源

2013-02-20 14:44:28

嘗試使用我的jQuery砍Create and access SVG tag with jQuery?

或者$("#svgphone").css({'background-image': "url(external.svg)"});

來源

2013-02-20 21:33:36

加載外部SVG文件

回答

相關問題