如何在javascript中添加svg對象中的文本

如何在javascript svg對象中添加文本節點。我正在使用這個對象，但我不知道如何將文本添加到SVG中。所有的如何在javascript中添加svg對象中的文本

var circlemarker = {   
     path: 'M-5,0a5,5 0 1,0 10,0a5,5 0 1,0 -10,0 z', 
     fillColor:'yellow', //'#f39c13', 
     fillOpacity: 0.8, 
     scale: 3, 
     strokeColor: '#f7692c', 
     strokeWeight: 2, 
     data: 'My text' // this is not working 
    };

來源

2015-08-21 Abhinav

難道你真的在谷歌搜索這個？ [第一個鏈接]（https://developer.mozilla.org/ru/docs/Web/SVG/Element/text）所以，你似乎必須在你的'circlemarker'裏面有__object__'text' –

是的，我被搜索了很長時間，但所有的例子都是HTML風格的，但我想在JavaScript中這樣做，以便我可以在谷歌地圖標記中使用它。 – Abhinav

首先，詳細瞭解SVG here

TL; DR
SVG正好被設置代表一個幾何圖形元素。簡單的SVG看起來像

<svg width="100" height="100"> 
    <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" /> 
    <text x="30" y="40">aaa</text> 
</svg>

注意<text></text>是一種元素，所以它不能內部<circle></circle>可以使用，但下面

所以添加文本，創建新的文本元素這樣

var textmarker = { 
    x: 10, 
    y: 40, 
    fontSize: 10, 
    fontFamily: 'Verdana', 
    value: 'some text' //this might be tricky, as per docs, text element filled by innerHTML property, try data, text, innerHTML, etc 
}

來源

2015-08-21 06:07:27

如何在javascript中添加svg對象中的文本

回答

相關問題