javascript - Unwanted border around canvas -
im writing text on canvas , drawing line. somehow, end unwanted border around canvas:
first write text in top right corner , call context.save(), draw line , call context.stroke().
code:
$(document).ready(function() { var canvas = document.getelementbyid('canvas'); var context = canvas.getcontext('2d'); context.beginpath(); context.rect(0, 0, canvas.width, canvas.height); context.fillstyle = 'black'; context.fill(); paintname(context, canvas); drawline(context); }); function paintname(context, canvas) { context.textalign = "left"; context.font = "16pt arial"; context.fillstyle = 'red'; context.filltext('g5', context.canvas.width - 35, 18); context.strokestyle = 'red'; context.save(); } function drawline(context){ var gatingcoords = [[30, 120], [50, 300]]; var nextx, nexty, pointx, pointy; context.linewidth = 4; (var = 0; < gatingcoords.length; i++) { pointx = gatingcoords[i][0]; pointy = gatingcoords[i][1]; if (i === gatingcoords.length - 1) { nextx = gatingcoords[0][0]; nexty = gatingcoords[0][1]; } else { nextx = gatingcoords[i + 1][0]; nextxy = gatingcoords[i + 1][1]; } context.moveto(pointx, pointy); context.lineto(nextx, nexty); } context.stroke(); } and fiddle here. how happening?
the border comes context.rect(0, 0, canvas.width, canvas.height). if add context.beginpath() right before paintname(context, canvas), border goes away.

Comments
Post a Comment