2015-02-26 4 views
1

Может кто-нибудь сказать мне, почему моя анимация не работает, пожалуйста? У меня две формы, которые я пытаюсь подкрутить. Я имею равное количество координат. Обе фигуры можно увидеть в кодированной ссылке ниже.SBG SMIL анимация flicking, но не анимация плавно

http://codepen.io/tands/pen/myKPPb

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="500px" height="500px" viewBox="0 0 453.5 290"> 

    <path 

    id="p1" 
    fill="#000000" 
    d=" 
         M226.8, 34.9 
         C146.3, 34.9, 71.5, 22, 8.9, 0 
         C3.1, 20.1, 0, 41.3, 0, 63.2 
         C0, 188.5, 101.5, 290, 226.8, 290 
         S453.5, 188.5, 453.5, 63.2 
         c0-21.9-3.1-43.1-8.9-63.2 
         C382.1, 22, 307.2, 34.9, 226.8, 34.9z 
         H0z 
         " 

/> 


<animate xlink:href="#p1" 
attributeName="d" 
attributeType="XML" 
from=" 
         M226.8, 34.9 
         C146.3, 34.9, 71.5, 22, 8.9, 0 
         C3.1, 20.1, 0, 41.3, 0, 63.2 
         C0, 188.5, 101.5, 290, 226.8, 290 
         S453.5, 188.5, 453.5, 63.2 
         c0-21.9-3.1-43.1-8.9-63.2 
         C382.1, 22, 307.2, 34.9, 226.8, 34.9z 
         H0z 
         " 
to=" 


         M8.9, 
         0 

           C3.1, 
           20.1, 
           0, 
           41.3, 
           0, 
           63.2 

         C3.1, 
         20.1, 
         0, 
         41.3, 
         0, 
         63.2 

         C0, 
         188.5, 
         101.5, 
         290, 
         226.8, 
         290 

         S453.5, 
         188.5, 
         453.5, 
         63.2 

         c0-21.9-3.1-43.1-8.9-63.2 

           C0, 
           0, 
           0, 
           0, 
           0, 
           0 

         H8.9z 



         " 
dur="2s" 

repeatCount="indefinite" 


/> 

ответ

1

Они не имеют одинаковое количество команд. На некоторых путях есть дополнительные команды z (или некоторые из них пропускают команды z в зависимости от вашей точки зрения).

Изменение вырожденный случай для этого ...

       C0, 
           0, 
           0, 
           0, 
           0, 
           0z 

делает все анимации гладко.

+0

Спасибо, анимация работает сейчас, но не так, как я надеялся http://codepen.io/tands/pen/myKPPb выглядит странно :( – Amesey

+1

Ваш вырожденный C странный, поэтому ваша анимация тоже странная. –

+0

Спасибо, я думаю я исправил это, но он не оживляет, как я надеялся. Он заполняется справа налево, я надеялся, что он поднимется с середины, как маска. Причина, по которой я не хочу использовать реальную маску, это происходит на фоновом изображении. – Amesey

Смежные вопросы