SnapSVGを使用する角度テキスト

Question

snapsvg.ioを使用すると、ボックスの下に配置された特定の長さの4本の縦線がボックスのx軸に均等に配置されていると言います。

どのようにすればよいかわからないのは、これらの縦線のそれぞれを取って、各行に均等に積み重ねられた特定の高さで45度の角度で表示されるテキストラベルを追加することです。それぞれの垂直線を横切って、左端から右端に向かってテキストを読めるようにします。

各ラベルの高さは、左端の縦線の下端に45度の角度で配置され、次の縦線に沿って、異なる高さの位置に45度の角度で配置されます

私は以下のことがありますが、構文が正しいとは思わないです。

var text = s.text(100, 100, 'Vert-Line-1'); 

text.attr({ 
    fill: stroke, 
    fontSize: '9px', 
    'font-weight': '600', 
    'text-anchor': 'start', 
    'transform': 'rotate(30 20,40)' 
}); 

snapsvgを使用して45度の角度でテキストを変換する方法の助けになります。

ありがとうございました。

Answer 1

実際、トランスフォームは機能するはずです。いくつか試してみてください...

まず、ダッシュ/マイナス記号が付いているので、これは間違っています。

Vert-Line-1 

変数名として

VertLine1 

を試してみてください（もし厥何そのことになって）それを定義し、それを使用した場合。

また、次を試して、問題が解決しない場合は、文字列を変換使用して...だからではなく、

'transform': 'rotate(30 20,40)' 

のが、最初の例はまだ動作するはず

transform: 'r30,20,40' 

を試みることができますそれは技術的には正しいですが、最初の修正がうまくいかなかった場合にそれが何か変わるかどうかを確認するために2番を含めます。

これ以外の場合、コンソールにエラーが表示されますか？ 「ストローク」が定義されているか、