如何在svg中添加多行文本（段落）

-1

我想在svg中添加多行文本，並將其包含在svg（無法溢出）中。我怎樣才能做到這一點？我知道'文字'標籤是用在svg中的，但我知道它的單行標籤。當我給它的文本長度（以便它包含在特定的svg中）時，它的單詞重疊。我怎麼能把多個行文本調整到svg標籤？我試過的代碼如下： - <svg width="21cm" height="29.7cm" style="border:1px solid black;"> <text x="6.4cm" y="3.6cm" textLength="50" style="font-size:48px;">The paragraph here</text> </svg>如何在svg中添加多行文本（段落）

來源

2017-05-12 AliSavi

它不起作用。 SVG沒有破解線的機制。

這就是說，你將能夠封裝一個html <p>標籤作爲foreignObject：

<svg xmlns="http://www.w3.org/2000/svg" 
    width="21cm" height="29.7cm" style="border:1px solid black;"> 
    <foreignObject x="6.4cm" y="3.6cm" width="10cm" height="10cm"> 
    <p xmlns="http://www.w3.org/1999/xhtml" 
     style="font-size:48px;">The paragraph here</p> 
    </foreignObject> 
</svg>

請注意，命名空間聲明必須給予，你需要編寫這有效XHML工作。

此外，foreignObject是SVG上下文的一部分，因此需要設置width和height，否則它將不具有固有大小。

來源

2017-05-12 18:02:43 ccprog

如何在svg中添加多行文本（段落）

回答

相關問題