使用svg.js加載SVG文件

Question

我在SO中已經看到了幾個與此主題相關的問題，並按照它們進行了一些操作（ 使用svg.js加載SVG文件 ），嘗試加載svg文件沒有成功。

__this.canvas = SVG('canvas').size(500, 500);
$.get('/cuentos/Rapunzel/prueba.svg', function(data) {
     __this.data = data;
     console.log(__this.data);
     __this.canvas.svg(__this.data);
});

__this.canvas是被以下述方式導入svgjs.Doc的類型：

import SVG from './node_modules/svg.js/svg.js';
declare var svgjs: (domElement: HTMLElement) => svgjs.Library;

錯誤：

我做錯了什么或想念什么。

有什么幫助嗎？

Answer 1

jQuery的$.get用於SVG，默認情況下會返回表示SVG的DOM對象。 SVG.js的svg函數需要一個字符串。

您可以簡單地強制JQuery返回類似這樣的字符串：

$.get('/cuentos/Rapunzel/prueba.svg', function(data) {
   __this.data = data;
   console.log(__this.data);
   __this.canvas.svg(__this.data);
}, 'text');

PS：我針對SVG.js打開了PR，以顯示針對該情況的正確錯誤消息： https : //github.com/svgdotjs/svg.js/pull/870

Answer 2

使用jQuery，此表單在經過測試的2.7.1和3.0.xi中均適用

    var svgp = SVG($('#<name of svg>')[0]);