キャンバスまたはsonic.js形式のベジエ曲線を使って単純なオブジェクトをトレースする

Question

円とベジエ曲線を使って単純なオブジェクトのアウトラインをトレースしたいと思います。 Photoshopの/ペンツールを使用して行う簡単な、しかし、私は次の形式での曲線の実際の座標が必要です

['bezier', startX, startY, endX, endY, cp1x, cp1y, cp2x, cp2y] 
['arc', cx, cy, radius, startDegree, endDegree] 

を、これが容易になりますアプリはありますか？これらの入力を試行錯誤して遊んでいるだけでは、直感的ではありません。ここで私が追跡できるようにしたいと思い何のサンプルです：これを実行できるようにする必要がある人のために

Answer 1

が、私は私が必要な形式で曲線を得ることができた（ソニック。 js形式）を作成します。私はその後、XMLエディタ（EDI​​T> InkscapeのXMLエディタ）を使用して、カーブを記述するパスのsvg 'd ='属性をコピーすることができました。次に、svg-to-canvasを使用してhtml5キャンバスコード（ctx.bezierCurveTo形式）を取得しました。関連する行をテキストファイルに保存し、このbashスクリプトを書いて、キャンバスコードをsonic.jsパスに変換しました。使用法convert.sh data.txt。出力は音波でうまくいく。最終結果はprobeです。

#!/bin/bash 
round() { 
     float=$1 
     echo "($float+0.5)/1" | bc 
} 
INDEX=1 
while IFS='' read -r rawline || [[ -n "$rawline" ]]; do 
line=$(echo $rawline | cut -d "(" -f2 | cut -d ")" -f1) 
if [ $INDEX -eq 1 ]; 
then 
     STARTX=$(round $(echo $line | cut -d',' -f1)) 
     STARTY=$(round $(echo $line | cut -d',' -f2)) 
     INDEX=2 
else 
     CP1X=$(round $(echo $line | cut -d',' -f1)) 
     CP1Y=$(round $(echo $line | cut -d',' -f2)) 
     CP2X=$(round $(echo $line | cut -d',' -f3)) 
     CP2Y=$(round $(echo $line | cut -d',' -f4)) 
     ENDX=$(round $(echo $line | cut -d',' -f5)) 
     ENDY=$(round $(echo $line | cut -d',' -f6)) 
     echo "['bezier', $STARTX, $STARTY, $ENDX, $ENDY, $CP1X, $CP1Y, $CP2X, $CP2Y]," 
     STARTX=$ENDX 
     STARTY=$ENDY 
fi 
done < "$1"