CODEWITHSUNDEEP
javascriptsvgjsfiddle
Steverino
Steverino

Reputation: 2266

SVG() returns null in JSFiddle

I wanted to learn some SVG and though JSFiddle would be the perfect place to play around with it. I'm getting null returned by the intial SVG('whatever') call. Is this something I'm missing/doing wrong, or something wrong with JSFiddle?

Here is the fiddle: https://jsfiddle.net/85gsveLd/

Here is my HTML:

<div id='canvas'><div>

And the 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)
}

The error:

Uncaught TypeError: Cannot read property 'size' of null

Note, I'm linking in svg.js v3.0.13 as a dependency.

Update: my code was based on a working JSFiddle example of an older version of svgjs. So, using the old code with the new svgjs version caused my errors. The lesson here was to always ensure your code targets the correct version of the library you're trying to use.

Upvotes: 1

Views: 469

Answers (1)

Wandrille
Wandrille

Reputation: 6811

You need to use https://cdnjs.cloudflare.com/ajax/libs/svg.js/3.0.13/svg.js in your ressource in your jsfiddle to use SVG(...)

And then var draw = SVG().addTo('#canvas').size(300, 300)

Upvotes: 2

Related Questions