Issue using D3-plus TextWrap for text inside Bubble Chart

163 Views Asked by At

I am struggling to use textWrap to properly adjust the size of the text and required line breaks. As a result I am having to split the text with a delimiter ';' using regex (after 15 chars) in an earlier part of my code.

Adding text wrap at this point either has no affect or renders the text as an object.

Any help or advice would be greatly appreciated

PS: I am very new to D3 so apologies in advance for any stupid mistakes

node.filter(d => !String(d.icon).includes('img/'))
            .append('text')
            .classed('node-icon', true)
            .attr('font-size', d=>d.radius > 100 ? "14" : "10")
            .attr("fill", "white")
            .attr('clip-path', d => `url(#clip-${d.id})`)
            .selectAll('tspan')
            .data(d => d.icon.split(';'))
            .enter()
            .append('tspan')
            .attr('x', 0)
            .attr('y', (d, i, nodes) => (13 + (i - nodes.length / 2 - 0.5) * 11))
            .text(name => name);
0

There are 0 best solutions below