A code
<!DOCTYPE HTML Public "-//W3C//DTD XHTML 1.0 transitional//en" "http://www.w3.org/TR/xhtml1/DTD/ Xhtml1-transitional.dtd "><HTMLxmlns= "http://www.w3.org/1999/xhtml"><Head> <title>Draw flowers with canvas</title> <Scripttype= "Text/javascript"> varcontext; varA, N; functionBtn_onclick () {varwidth; varheight; varCanvas; varXo, Yo; varK; Canvas=document.getElementById ("Canvas"); Width=Canvas.width; Height=Canvas.height; Context=Canvas.getcontext ('2d'); Xo=width/2;Yo=Height/2;k=parseint (document.getElementById ("Drawtype"). Value); if(k==2) A=Yo*0.25; ElseA=Yo*0.75; Context.save (); Context.clearrect (0,0, Width,height); Context.translate (XO,YO); Context.beginpath (); for(varB=0; B<=6.28; B=B+0.01) {Draw (B); } context.closepath (); Context.restore (); } functionDraw (B) {varN= Ten; Switch(parseint (document.getElementById ("Drawtype")) { Case 3: R=A*Math.sin (n*B)*Math.exp (-B/ ( -)); Break; Case 2: R=A*(Math.sin (n*B))+ 3 *Math.sin (3 *N*B); Break; Case 1: R=A*Math.sin (n*B); } x=R*Math.Cos (B); Y=R*Math.sin (B); Context.fillstyle= "Green"; Context.strokestyle= "Black"; Context.lineto (-x,-y); Context.fill (); Context.stroke (); } </Script> <H1>Draw flowers with canvas</H1>Types of flowers:<SelectID= "Drawtype"> <optionvalue= "1">Penglai Chrysanthemum</option> <optionvalue= "2">Nopalxochia</option> <optionvalue= "3">Dahlia</option> </Select> <inputtype= "button"ID= "BTN"value= "Draw"onclick= "Btn_onclick ()" /> <BR/> <CanvasID= "Canvas"width= "200px"Height= "200px"></Canvas></Head><Body></Body></HTML>
Draw flowers with canvas