«Легкость» TweenLite не работает на Angular 7 - PullRequest
Новая
       71

«Легкость» TweenLite не работает на Angular 7

0 голосов
/ 07 февраля 2019

Я создаю анимационный фон с помощью GSAP TweenLite.и я в настоящее время внедряю его на угловой компонент.но он всегда выдает ошибку "Не удается найти имя 'circ', включенное в TweenLite. Как мне исправить эту проблему?

Я уже пробовал другие платформы GSAP, но всегда выдает ту же ошибку.

/ app.component.ts 

import { Component } from '@angular/core';
import TweenLite from "gsap/TweenLite";

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent { 

  ngOnInit() { 

    initAnimation();

    // animation
    function initAnimation() {
        animate();
        for(let i in points) {
            shiftPoint(points[i]);
        }
    }

    function shiftPoint(p) {
        TweenLite.to(p, 1+1*Math.random(), {x:p.originX-50+Math.random()*100,
            y: p.originY-50+Math.random()*100, ease:Circ.easeInOut,
            onComplete: function() {
                shiftPoint(p);
            }});
    }

  }

}

см. Эту ссылку для справки о том, что ожидается на выходе.

https://hencework.com/theme/pogody/constellation/index.html (точечная и линейная анимация)на правой части)

1 Ответ

0 голосов
/ 07 февраля 2019

Я как-то понял.

Я исследовал онлайн и обнаружил, что неправильно импортирую gsap.

вот ссылка: https://greensock.com/forums/topic/13445-using-gsap-with-angular2/

каким-то образом вам нужно указать модуль на область импорта в компоненте * .ts (не нужно использовать импорт)

Он по-прежнему указывает на то, что Circ не может быть найден, но выводит ожидаемый результат.

Weird ...

...