SVG() returns 在 JSFiddle 中为 null

Question

我想学习一些 SVG，尽管 JSFiddle 是玩弄它的完美场所。初始 SVG('whatever') 调用返回 null。这是我 missing/doing 的错误，还是 JSFiddle 的错误？

这是 fiddle： https://jsfiddle.net/85gsveLd/

这是我的 HTML:

<div id='canvas'><div>

和 JS：

if(document.readyState === 'complete') {
  initialize()
}
else {
  window.addEventListener('load', initialize)
}

function initialize() {
  var draw = SVG('drawing').size(300,300)
  var rect = draw.rect(100, 100)
}

错误：

Uncaught TypeError: Cannot read property 'size' of null

注意，我在 svg.js v3.0.13 中作为依赖链接。

更新： 我的代码基于旧版本 svgjs 的有效 JSFiddle 示例。因此，将旧代码与新的 svgjs 版本一起使用导致了我的错误。这里的教训是始终确保您的代码以您尝试使用的库的正确版本为目标。

Answer 1

您需要在 jsfiddle 的资源中使用 https://cdnjs.cloudflare.com/ajax/libs/svg.js/3.0.13/svg.js 才能使用 SVG(...)

然后var draw = SVG().addTo('#canvas').size(300, 300)

SVG() returns 在 JSFiddle 中为 null

SVG() returns null in JSFiddle

javascript

svg

jsfiddle