如何解释two.js中的外部svg文件

时间:2014-02-12 06:56:50

标签: javascript svg two.js

有什么方法可以在two.js中解释带有object标签的外部svg文件? 我尝试了以下方式,但是..

HTML

<object type="image/svg+xml" data="./svg/mydrawing.svg" id="mysvg"></object>

JS

var mySvg = document.getElementById("mysvg").contentDocument;
var shape = two.interpret(mySvg);
console.log(shape);

//in console:
Uncaught TypeError: Cannot call method 'toLowerCase' of undefined

如果我可以导入外部.svg文件,这很好,因为我的svg文件太大而无法用HTML编写内联SVG。

提前致谢。

1 个答案:

答案 0 :(得分:4)

可能需要在contentDocument中选择svg标记。例如:

var svgObject = document.getElementsByTagName('object')[0];
svgObject.onload = function(){
      var mySvg = svgObject.contentDocument.getElementsByTagName('svg')[0];
      var two = new Two();
      var shape = two.interpret(mySvg);
      console.log(shape);
};