javascript - iPad HTML5 canvas not refreshing -
edit: demo code found in "parallelogram explorer" tab here: http://atmdev01.procloud.net/geometry_tools9/
so i'm calling following javascript function @ document load draw perimeter of parallelogram, , working fine that. issue when call function touchmove handler allow ipad user adjust size of parallelogram, canvas not redrawing shape. in fact not responding @ all. i've run alerts verify function being run , is.
could issue way i'm clearing canvas (the "canvas.width = canvas.width + 0" method) or refresh rates on ipad?
the interesting part it's working in desktop browser using mousemove, not on ipad using touchmove. please advise...
(the "corners" in code areas user can touch , drag resize parallelogram)
this.drawsides = function() { var order = [1, 2, 4, 3]; var canvas = document.getelementbyid("canvas"); var ctx = canvas.getcontext("2d"); var firstcorner = this.getcornerobj(1); var secondcorner = this.getcornerobj(2); var firstcorneropp = this.getcornerobj(firstcorner.opp); var secondcorneropp = this.getcornerobj(secondcorner.opp); /* clear canvas , draw parallelogram provided corners */ canvas.width = canvas.width + 0; //clears canvas faster clearrect ctx.beginpath(); (i in order) { if (i < order.length) { var cornerobj = this.getcornerobj(order[i]); if (order[i] > 1) { var prevobj = this.getcornerobj(order[i-1]); ctx.moveto(prevobj.x + (prevobj.width)/2, prevobj.y + (prevobj.height)/2); ctx.lineto(cornerobj.x + (cornerobj.width)/2, cornerobj.y + (cornerobj.height)/2); } } } ctx.lineto(firstcorner.x + (firstcorner.width)/2, firstcorner.y + (firstcorner.height)/2); ctx.strokestyle = "#300"; ctx.stroke(); }
the canvas isn't cleared canvas.width = canvas.width;
in safari.
Comments
Post a Comment