SVG animateTransform не обновляется от и до изменения значения - PullRequest
Новая
       33

SVG animateTransform не обновляется от и до изменения значения

0 голосов
/ 21 мая 2019 
<line x1="100" y1="100" x2="100" y2="35" stroke="white" stroke-width="4" stroke-linecap="round">
    <animateTransform attributeName="transform" attributeType="XML" type="rotate" [attr.from]="initialValue + ' 100 100'" [attr.to]="updatedValue + ' 100 100'" dur="2s" additive="sum" fill="freeze"/>
</line>

или 

<line x1="100" y1="100" x2="100" y2="35" stroke="white" stroke-width="4" stroke-linecap="round">
    <animateTransform attributeName="transform" attributeType="XML" type="rotate" attr.from="{{initialValue }},100,100" attr.to="{{updatedValue }},100,100" dur="2s" additive="sum" fill="freeze"/>
</line>

в файле .ts 

ngOnInit() {
    this.initialValue = 0;
    this.updatedValue = 90;
}

changeCompassValue(){
    this.initialValue = this.updatedValue ;
    this.updatedValue = Math.random() * 360;
}

Приведенный выше код анимирует svg при первой загрузке и поворачивает строку от 0 до 90 градусов, после чего любое изменение значений на значения с и на не обновляется.

Может кто-нибудь определить проблему?

...