But if you display the text goes beyond. How can I fix the problem?
1 Answer, 1 is accepted
0
Vessy
Telerik team
answered on 16 Jun 2014, 11:16 AM
Hi Lex,
The experienced behavior is connected with a limitation in the RadDiagram control to wrap multi-line text. We have already planned the implementation of such a feature, but for the time being you can use the approach used in the RadDiagram Overview demo, utilizing the control's Visual functionality. For example:
if (options.type != "text" && options.content && options.content.text) {
text = options.content.text.split("|");
var textHeight = options.height - (text.length - 1) * lineHeight;
for (var i = 0; i < text.length; i++) {
var y = (i * lineHeight);
textLines.push(new ns.TextBlock({
text: text[i],
x: 0,
y: y,
width: options.width,
height: textHeight + 2 * y,
color: options.stroke.color,
fontFamily: "Segoe UI"
}));
}
options.content.text = "";
}
if (type == "rectangle") {
shape.append(new ns.Rectangle(options));
}
for (var j = 0; j < textLines.length; j++) {
var textLine = textLines[j];
shape.append(textLine);
canvas.append(shape);
textLine.align(options.content.align);
canvas.remove(shape);
}
return shape;
}
function cleanUpShapesContent(shapes) {
Array.forEach(shapes, function (shape) {
shape.content("");
});
}
</script>
I hope this information will be helpful for you in implementing the desired scenario.
Kind regards,
Vessy
Telerik
Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.