javascript - Canvas: Draw Lines on top of Filled Rectangle -


i have function here that's supposed draw square , plus sign in middle, reverse colors if mouse on it. works fine if mouse not on top, once filled, plus sign disappears. assume it's being covered up.

function drawadd(cx, cy, btnw, btnh, mouse) {     var getid = document.getelementbyid("canvas_1");     var color = "black";     var px = cx + btnw/2;     var py = cy + btnh/2;      if (getid.getcontext)     {         var ctx = getid.getcontext("2d");          ctx.clearrect(cx, cy, btnw, btnh);         ctx.linewidth = "10";         ctx.fillstyle = "black";          if(mouse)         {             ctx.fillrect(cx, cy, btnw, btnh);             color = "white";         }         else         {             ctx.strokerect(cx, cy, btnw, btnh);         }          ctx.beginpath();         ctx.linewidth = "20";         ctx.fillstyle = color;         ctx.moveto(px - 40, py);         ctx.lineto(px + 40, py);         ctx.moveto(px, py - 40);         ctx.lineto(px, py + 40);         ctx.stroke();         ctx.closepath();     } } 

what doing wrong here?

you need replace ctx.fillstyle = color ctx.strokestyle = color line color set strokestyle, not fillstyle.

here's working jsfiddle.


Comments

Popular posts from this blog

Change the color of an oval at click in Java AWT -

c# - Unity IoC Lifetime per HttpRequest for UserStore -

I am trying to solve the error message 'incompatible ranks 0 and 1 in assignment' in a fortran 95 program. -