html5 - Write text inside rectangle -
i trying find how filltext inside rectangle. unfortunately can find c# projects/tutorials. possible add text inside rectangle in html5 in canvas? want each rectangle (node) have different text on example 1 called cow , other tiger , on. possible? have tried everything!
var x = 150; var y = 100; var canvas = $('#nodelist').get(0); var ctx = canvas.getcontext('2d'); ctx.font = "30px arial"; canvas.height = 0; var rects = [ [20, 20, x, y], [20, 220, x, y], [20, 420, x, y], [20, 620, x, y], [20, 820, x, y], [20, 1020, x, y], [20, 1220, x, y], [20, 1420, x, y], [20, 1620, x, y] ]; (var = 0; < rects.length; i++) { canvas.height = canvas.height + 200; ctx.clearrect(0, 0, canvas.width, canvas.height); //rectangles opnieuw tekenen (var j = 0; j < i; j++) { ctx.fillrect(rects[j][0], rects[j][1], rects[j][2], rects[j][3]); } ctx.fillrect(rects[i][0], rects[i][1], rects[i][2], rects[i][3]); } $('#nodelist').click(function (e) { var x = e.offsetx, y = e.offsety; (var = 0; < rects.length; i++) { if (x > rects[i][0] && x < rects[i][0] + rects[i][2] && y > rects[i][1] && y < rects[i][1] + rects[i][3]) { alert('vierkant ' + + ' clicked'); } } }); enter code here
i hope link out....
http://andreinc.net/2012/11/14/painting-and-wrapping-a-text-inside-a-rectangular-area-html5-canvas/
Comments
Post a Comment