Lottie-web: Data.json - Uncaught SyntaxError: Unexpected token : data.json:1
Dev environment
Jekyll build
Gulp
Jade
Sass
Chrome Version 65.0.3325.181 (Official Build) (64-bit)
I created a test animation as both a placeholder and to check I could link it all up correctly, the animation exported properly and worked as a demo.
I then tried to add this to my site, but the animation won't show. Debug revealed Data.json - Uncaught SyntaxError: Unexpected token : data.json:1
Which causes the definition error in the functions.js file
jamesdanstone
All 6 comments
Hi, do you have a working version uploaded somewhere I can check?
bodymovin
on 27 Mar 2018
Yes it's here
Please excuse the missing images!
jamesdanstone
on 27 Mar 2018
no problem
you need to pass the path as a string. Change this:
javascript
var params = {
container: document.getElementById('lottie'),
renderer: 'svg',
loop: true,
autoplay: true,
path: assets/js/data.json
};
to this:
javascript
var params = {
container: document.getElementById('lottie'),
renderer: 'svg',
loop: true,
autoplay: true,
path: 'assets/js/data.json'
};
bodymovin
on 27 Mar 2018
Ah yeah thank you I've changed that, but I am still getting the error for data.json and now an error on the function? Thanks for your help!
Uncaught SyntaxError: Unexpected token :
Uncaught TypeError: lottie.loadAnimation is not a function
jamesdanstone
on 27 Mar 2018
you're loading functions before lottie, so lottie doesn't exist yet when you're calling it.
Try inverting the order of the js files.
bodymovin
on 27 Mar 2018
Brilliant I'm all sorted! Thanks very much.
jamesdanstone
on 27 Mar 2018
Related issues
phantomboogie
路
4Comments
casillasluisn12
路
4Comments
ochanje210
路
3Comments
dulllud
路
3Comments
Ipaulsen
路
4Comments
Most helpful comment
no problem
you need to pass the path as a string. Change this:
javascript var params = { container: document.getElementById('lottie'), renderer: 'svg', loop: true, autoplay: true, path: assets/js/data.json };to this:
javascript var params = { container: document.getElementById('lottie'), renderer: 'svg', loop: true, autoplay: true, path: 'assets/js/data.json' };