Soy nuevo en mecanografiado y svg y d3, así que tengo este código

 this.main .selectAll(this.appCssConstants.sliceLabel.selectorName) .data(root) .enter() .append("text") .style("fill", "blue") .classed(this.appCssConstants.sliceLabel.className, true) // font size + slice padding .attr("dy", (d, i) => { return labelshift - d.depth * labelshiftmulti; }) .append("textPath") .attr("startOffset", "50%") .attr("xlink:href", (d, i) => "#sliceLabel_" + i) .text(dataPoint => dataPoint.data.name) .attr("textLength") .each(this.wrapPathText(labelPadding));

...

 private wrapPathText(padding?: number): (slice: HierarchyRectangularNode<SunburstDataPoint>, index: number) => void { const self = this; return function () { const selection: Selection<BaseType, any, BaseType, any> = d3Select(this); const width = (<SVGPathElement>d3Select(selection.attr("xlink:href")).node()).getTotalLength(); self.wrapText(selection, padding, width); }; } private wrapText(selection: Selection<BaseType, any, BaseType, any>, padding?: number, width?: number): void { let node: SVGTextElement = <SVGTextElement>selection.node(), textLength: number = node.getComputedTextLength(), text: string = selection.text(); width = width || 0; padding = padding || 0; while (textLength > (width - 2 * padding) && text.length > 0) { text = text.slice(0, -1); selection.text(text + "\u2026"); textLength = node.getComputedTextLength(); } if (textLength > (width - 2 * padding)) { selection.text(""); } }

Tengo un bucle ".each" en la primera parte del código que llama al método wrapPathText y wrapPathText tiene un bucle for que lleva mucho tiempo en el bucle para cortar texto

Mi pregunta es: ¿hay alguna forma de optimizar este bucle? Por ejemplo, ¿quitar más de una letra en cada bucle para que quepa en la cadena? Otra pregunta: ¿hay alguna manera de ajustar una cadena con una longitud específica (en mi caso, 'ancho - 2 * relleno'), por ejemplo, con la ayuda de un atributo específico sin usar el bucle for no optimizado?