https://github.com/synapsium/ngx-lottie
High quality animation library natively on web based on After Effect redering
https://github.com/synapsium/ngx-lottie
angular lottie
Last synced: about 1 month ago
JSON representation
High quality animation library natively on web based on After Effect redering
- Host: GitHub
- URL: https://github.com/synapsium/ngx-lottie
- Owner: Synapsium
- Created: 2019-01-02T21:19:24.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2023-01-04T20:36:45.000Z (over 3 years ago)
- Last Synced: 2025-02-16T14:51:08.668Z (over 1 year ago)
- Topics: angular, lottie
- Language: TypeScript
- Homepage:
- Size: 3.64 MB
- Stars: 1
- Watchers: 2
- Forks: 1
- Open Issues: 25
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
Quickly way to integrate Lottie-web component with Angular
# Lottie
Lottie is a mobile library for Web, and iOS that parses Adobe After Effects animations exported as json with Bodymovin and renders them natively on mobile!
View documentation, FAQ, help, examples, and more at here.
## Setup
### Installation
Install `lottie-web` and `ngx-lottie` library from `npm`
```bash
npm install lottie-web @synapsium/ngx-lottie --save
```
### Module usage
Add `lottie.min.js` into angular.json
```javascript
"scripts": [
"node_modules/lottie-web/build/player/lottie.min.js"
]
```
Add `LottieModule` to module
```javascript
import { LottieModule } from '@synapsium/ngx-lottie';
@NgModule({
...
imports: [
...
LottieModule
]
})
```
## How to use
Add the following tag in your html :
```html
```