ジョイントjs - svgのパスに沿って円を描く

Question

私はジョイントjsの初心者であり、限られたジャバスクリプトスキルも持っています。私が遂行しようとしているのは、Animateボタンをクリックすると、アニメーションサークルは最初から最後までのパスに沿っているはずです。パスに従いますが、オンラインではありません。

c = V('circle', { 
       r: 8, 
       fill: 'red' 
      }); 
     var cylinderView = graph.getCell(reserved_path[player[i]]).findView(paper); 
     var cylinderPath = cylinderView.vel.findOne('path'); 
     var cyclic = graph.getCell(jQuery("#"+player[i]).attr('model-id')).findView(paper); 
     var cylinderScalable = cyclic.vel.findOne('.scalable'); 

     var cylinderScalableCTM = cylinderPath.node.getCTM().inverse(); 

     c.animateAlongPath({ 
      dur: '5s', 
      repeatCount: '1' 
     }, cylinderPath.node); 

     c.scale(2, 2); 

     cylinderScalable.append(c); 

何私が理解していることcylinderScalable.append（c）の行は、この問題を作成していると私は直接SVGに詳細情報を追加することができれば、それが解決される可能性があることですが、私はそれを達成する方法がわからない

完全なコードは次のとおりです。https://jsfiddle.net/9espjppv/

ご協力いただきありがとうございます。

Answer 1

このdocを見てください、それはあなたの

var c = V('circle', { r: 8, fill: 'red' }); 
c.animateAlongPath({ dur: '4s', repeatCount: 'indefinite' }, paper.findViewByModel(myLink).$('.connection')[0]); 
V(paper.svg).append(c); 

を助けるかもしれません