Vivus.js with Mean.js not working

Question

I am creating a simple animation with vivus.js, however it is not working. 1st I create the svg and give an id. Then I create a function:

function vivus(){
    console.log("work")
    new Vivus('Layer_1', {type : "async/ oneByOne/delayed"});

    }

I am simply passing in the element id, and then the object with key value pairs. This should work but I am getting this error in the console:

Uncaught Error: Vivus [constructor]: "element" parameter is not related to an existing ID

Answer 1

That error means Vivus couldn't find your "Layer_1" id

You have to call "new Vivus" after your svg tag in your HTML.

Using the callback window.onload() might be a solution for non-inline scripts in external JS files. Otherwise, put the script tag that calls Vivus at the end of your body to get around the error.