0

In this example below, why does the draw.clear() method throw the error TypeError: Cannot read property 'parentNode' of undefined at create.clear? What can I do to get the clear method to work and not throw any errors?

import * as SVG from 'svg.js';
import 'svg.filter.js';

// create the svg
let draw = new SVG.Doc('root');
draw.size('100vw', '100vh');

// create a rect with a dropshadow
let rect = draw.rect(100, 50).x(50).y(80).fill('red').stroke({
  color: 'green',
  width: 10
})

draw.clear()

Edit webpack and svg.filter.js example

Chad
  • 1,708
  • 1
  • 25
  • 44
  • 1
    What's the error? – rmlan Jan 15 '18 at 19:11
  • 1
    I updated the question with the error. You can also just click on that big blue button to see the error. – Chad Jan 15 '18 at 19:13
  • 1
    I know I could have clicked on the big blue button, but why should I have to leave Stack Overflow to see a simple error message? If you want help, put some effort into the question. – rmlan Jan 15 '18 at 19:20

2 Answers2

1

I forked your code and tried using draw.remove() instead of draw.clear(), and that appears to work. This appears to be a glitch in the version of SVG.js you are using - as I've only used the regular JS version, I'm not sure where your problem is - but you should try the Github issues site for SVG.js and post there, FuzzyMa is active and helps a lot of folks out. I did find an issue on the Github site that could be related, regarding the Typescript compiler.

Stacey Reiman
  • 666
  • 4
  • 13
1

FuzzyMa provided the answer to this after I posted an issue. Here is his response:

Dont use SVG.Doc directly if you dont know what you are doing:

https://codesandbox.io/s/9ymx30pjxp

Chad
  • 1,708
  • 1
  • 25
  • 44