使用SnapSVG的角度文本

使用snapsvg.io，我說有4條垂直線，它們位於一個盒子的下方，均勻地分佈在盒子的x軸上。使用SnapSVG的角度文本

我不知道該怎麼做，是將每條垂直線條加上一條文本標籤，並將每條線均勻地堆疊在每條線上，但是在某些高度並以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度角度轉換我的文字的任何幫助。

謝謝。

來源

2016-05-30 tonyf

其實，轉換應該工作。嘗試幾件事...

首先這看起來不對，因爲它有一個破折號/減號。

Vert-Line-1

嘗試

VertLine1

作爲一個變量名（如果那是什麼它應該是）定義它時，並使用它。

您也可以嘗試以下，並使用變換字符串，如果還是不行......所以不是

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

嘗試

transform: 'r30,20,40'

然而，第一個例子應該仍然工作，它在技術上是正確的，但包括第二個只是爲了看看如果第一次修復不起作用，它是否會有所作爲。

否則，您是否在控制檯中看到任何錯誤？是'中風'的定義，

來源

2016-05-30 08:30:01 Ian

使用SnapSVG的角度文本

回答

相關問題