Error: <svg> attribute viewBox: Expected number, "0 0..

chenqingspring / vue-lottie

Render After Effects animations on Vue based on Bodymovin

MIT License

1.31k stars 281 forks source link

Error: <svg> attribute viewBox: Expected number, "0 0.. #20

Open wrabit opened 5 years ago

wrabit commented 5 years ago

Setting up as per the example and getting:

Error:

Any ideas?

Sweetyy commented 5 years ago

Same problem .. i did exactly the same as the example and always have this error...

patrick-sung commented 5 years ago

should be animationData: animationData.default

Sweetyy commented 5 years ago

Thanks a lot ! It works for me now :)

sebbean commented 5 years ago

damn me to! frigg! thanks github!

Xiaoha0226 commented 5 years ago

It works for me too. Thanks! I want to know the reason is 'lottie-web' version upgrade？

seemcat commented 5 years ago

@patrick-sung you saved me from something that's been blocking me the entire day. THANK YOU! 😭

ZalgirisKaunas commented 5 years ago

OMG. WHY THIS ISN'T IN THE DOCUMENTATION.

I literally wasted half of the day..

lansolo99 commented 5 years ago

Yeah, had the same problem, please update the doc, I would never have figured out by myself if @patrick-sung didn't reveal the trick

TimRChen commented 5 years ago

How can I find this in the Lottie doc?

alexsandro-xpt commented 5 years ago

Ow please update the documentation( https://github.com/chenqingspring/vue-lottie/blob/master/README.md#L65 ) for animationData.default please!

dhruvbhatia7 commented 5 years ago

Thanks @patrick-sung, was stuck on this for over an hour!

jeancabral commented 5 years ago

Thx so much

Very thx! Save my day!

carlossrb commented 5 years ago

thanks a lottie!!!

cmdparkour commented 4 years ago

thanks for your help,

Xiaoshizaizi commented 4 years ago

so cool

DevidJoshua commented 4 years ago

After

Finally, thanks ya,,, anyone tell me why it's not working as the documentation...

pitometsyurii commented 4 years ago

Good question. But seems like it will not be fixed.

yehee commented 4 years ago

Could also change how it's imported:

- import * as animationData from './planets-spinning.json'
+ import animationData from './planets-spinning.json'

This way you don't have to get animationData.default as it automatically imports the default.

cazroam commented 4 years ago

2 years later and the documentation still needs updating :(

There are even PRs for it: https://github.com/chenqingspring/vue-lottie/pull/40 https://github.com/chenqingspring/vue-lottie/pull/42 https://github.com/chenqingspring/vue-lottie/pull/51

@chenqingspring please update? :)

freddymais commented 3 years ago

Sensacional!!! Uffaaaa.. ja tava desistindo.. Valeu demais!

subodhk01 commented 3 years ago

@patrick-sung god

jackdewhurst commented 3 years ago

Update the docs!!!

anearseeyou commented 3 years ago

nice

vitpankin commented 3 years ago

what about Typescript? it's not happy with that saying Property 'default' does not exist on type '{ v: string; fr: number; ip: number; op: number; w: number; h: number; nm: string; ddd: number; assets: ({ id: string;

vitpankin commented 3 years ago

Yeah, for TypeScript it's better to do import { default as animationData } from '../animation-with-blackjack-and-hooks.json' and then

const defaultOptions:Options = { loop: true, autoplay: true, animationData: animationData, rendererSettings: { preserveAspectRatio: 'xMidYMid slice' } };

wbdservices commented 1 year ago

where add this?

raheesm commented 1 year ago

where should i add this