KUTE.jsあなたが見ることができるようにSVGパスが

Question

Here is a codepen i made.

モーフィングない、パスがモーフィングされていません。 私はすでに問題がsvgの中にあるという結論に飛び乗ってきました。彼らはモーフィングしていません。 何が問題なのでしょうか？図形は非常に単純で、すべて同じサイズとアンカーを持ち、kute.js documentationにあるように、「閉じた図形（そのd属性はzで終わります）」

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 600 600" > 
    <path id="n1" fill="orangered" d="M62,7.5l210,20l30,230l-290-60L62,7.5z"/> 
    <path id="n2" style="visibility:hidden" d="M0,7.5l315,32l-31,189l-280,31L0,7.5"/> 
    </svg> 

Answer 1

最新版fixes問題です。 2つのポリゴンの点数が同じ場合、プラグインはケースを処理しませんでした。

問題のコード

if (s.length !== e.length){ 
    arL = Math.max(s.length,e.length); 
    if (arL === e.length) { sm = s; lg = e; } else { sm = e; lg = s; } 
    sml = sm.length; 

    smp = S.cP('M'+sm.join('L')+'z'); len = smp.getTotalLength()/arL; 
    for (var i=0; i<arL; i++){ 
     tl = smp.getPointAtLength(len*i); 
     cs = S.gCP(len,tl,sm); 
     nsm.push([ cs[0], cs[1] ]); 
    } 

    if (arL === e.length) { e1 = lg; s1 = nsm; } else { s1 = lg; e1 = nsm; } 
    } else { // here we know the paths have same number of points 
    s1 = s; e1 = e; 
    } 

Codepen demo。