Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How to either determine SVG text box width or force line breaks after 'x' characters?
Use the getBBox() function and add a single word at a time to a text object. When it gets too wide, you need to add a line feed.
var a = Raphael(500, 500);
var b = a.text(100, 100).attr('text-anchor', 'start');
var maxWidth = 100;
var content = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis nec semper mauris. Sed gravida augue feugiat nulla ultrices efficitur. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed sit amet lobortis eros, et lobortis diam. Aenean arcu velit, condimentum eu lacus in, dignissim bibendum odio. Mauris ultricies nunc et lorem bibendum dignissim. Ut porttitor purus vitae diam efficitur ultrices. Integer dignissim efficitur lorem, non vehicula diam scelerisque at ";
var w = content.split(" ");
var tempText = "";
for (var i = 0; i < w.length; i++) {
b.attr("text", tempText + " " + words[i]);
if (b.getBBox().width > maxWidth) {
tempText += "
" + words[i];
} else {
tempText += " " + words[i];
}
}
b.attr("text", tempText.substring(1));
Updated on: 27-Jan-2020
116 Views
Advertisements