d3.js中使用foreignObject

d3.js中使用foreignObject

使用svg的時候只能使用text，而且該text和html中的有差異，沒有移除隱藏的屬性。還好svg有個foreignObject，可以支持html的標籤。
下面是通過d3.js中添加一個div標籤。需要注意的是'xhtml:div'，需要一個xhtml作爲前綴。

 const fogt = g.append('foreignObject')
        .attr('x',0).attr('y',85).attr('width','180').attr('height','50')
        const t1 = fogt.append('xhtml:div')
        .style('color', "white")
        .text('12111111113')
        .style('overflow', 'hidden')
        .style('text-overflow', 'ellipsis')