Ed Jay
10/24/2014 12:37:00 AM
My application creates contenteditable divs as child elements of a
another div. Each created div is given the id of 'mrkr'+i, where i is
the number of divs created, i.e., the first created div has
id='mrkr0,' etc. I enter text into those divs. If the text is longer
than the div min-width dimension, the text is word-wrapped to a new
line. Alternatively, I hit ctrl-return to manually create the new
line.
I want to place the contents of each div onto a canvas
("save_canvas"), at the same location as the original text,
which locations are stored in two arrays (x_pos_array and
y_pos_array), and with the same line breaks as in the created divs. I
[attempt] this with the following:
cnt = x_pos_array.length;
for (var i = 0; i < cnt; i++) { //look at all child divs
test_div = document.getElementById('mrkr'+i).innerHTML;
if(test_div !='') { //if there's text in the div
x = x_pos_array[i];
y = y_pos_array[i];
save_canvas.fillStyle = 'white';
save_canvas.font = "12pt 'Arial Narrow'";
save_canvas.fillText(test_div, x, y);
}
}
This works, with the exception that none of the line breaks,
whether word wrapped or manually entered, are effected on the
canvas. The text flows to the right, out of the canvas.
Is there a method for capturing the line breaks in the original
divs on the canvas?
I needn't be provided with code...a simple yes or no will guide me.
Thanks,
--
Ed Jay (remove 'M' to respond by email)