如何使用JavaScript繪製簡單的火柴人？

 function setup(){ 

     a = 5; 
    } 

    function draw(){ 
     background(0,0,0); 


     if (a == 5) 
     { 
     fill(255,255,255); 
     ellipse(250,150,100,100); 

     fill(255,255,255); 
     rect(245,199,10,160); 

     fill(255,255,255); 
     rect(150,199,200,10); 
} 
    if (a == 6) 
    { 
    fill(250,189,65); 
    ellipse(250,250,100,100); 

    fill(178,102,255); 
    ellipse(250,250,500,100); 
    } 
} 

function keyTyped() 
    { 
    a = 5; 
    } 
    if (key == 'f') 
    { 
    a = 6; 
    } 
}

^ 以上是JavaScript（sketch.js），HTML只是如何使用JavaScript繪製簡單的火柴人？

<!DOCTYPE html> 
<html> 
    <head> 
    <body> 




    </body> 
</html>

這是我迄今爲止，它只是表示頭部，手臂和身體，我不能找到一種方法來做腿部的對角線/或弧線

編輯：我只是粘貼完整的代碼，我正在尋找創建一個拱形線最簡單的方法？

來源

2017-03-28 William Wang

你的代碼是不完整的 –

發表完整的代碼的HTML和JavaScript –

你可以試試這個：

function setup(){ 

    createCanvas(500,500); 

    // initialize a, assign the value 5 to a 
    a = 5; 
} 

function draw(){ 
    background(0,0,0); 

    fill(255,255,255); 
    text("M for Stickman, F for Flower",10,30); 

    if (a == 5) 
    { 


    ellipseMode (CENTER); 

ellipse (150,60,50,50); 
point (140,60); 
point (160,60); 

rectMode (CENTER); 

rect (150,135,50,100); 

line (125,85,100,160); 
line (175,85,200,160); 
line (130,185,130,250); 
line (130,250,125,250); 
line (170,185,170,250); 
line (170,250,175,250); 
}

https://www.openprocessing.org/sketch/34624#

來源

2017-03-28 15:25:09

哎，你介意解釋的代碼行？（rectMode，elliposeMode）我對這個東西很新。 –

我如何使用ellipseMode創建一朵花？如在，另一個橢圓內的橢圓？ –

這裏有：http://processingjs.org/reference/ellipseMode_/ 這解釋瞭如何使用ellipseMode –

如何使用JavaScript繪製簡單的火柴人？

回答

相關問題