Как на основе кода для рисования снеговика функцию drawSnowman, которая рисует снеговика в указанной позиции на холсте к примеру drawSnowman(0, 0 )?

Question

[anthon-help]

Здравствуйте всем!
Есть код который рисует снеговика:

var drowSnowman = function() {
            function drawCircle(x, y, radius, fillCirсle) {
            ctx.beginPath();
            if (fillCirсle === true) {
                ctx.lineWidth = 4;
                ctx.arc(x, y, radius, 0, Math.PI * 2, false);
                ctx.stroke();
            } else if (fillCirсle === false) {
                ctx.arc(x, y, radius, 0, Math.PI * 2, false);
                ctx.fill();
            }
        };
        
        drawCircle(100, 100, 30, true);
        ctx.fillStyle = "orange";
        drawCircle(100, 105, 5, false);
        ctx.fillStyle = "black";
        drawCircle(90, 95, 5, false);
        drawCircle(110, 95, 5, false);
        drawCircle(100, 170, 40, true);
        drawCircle(100, 150, 5, false);
        drawCircle(100, 170, 5, false);
        drawCircle(100, 190, 5, false);
        };

        drowSnowman();

Как сделать так, чтобы при указании drowSnowman(100, 100) или drowSnowman(300, 0) снеговик появлялся на этих координатах. Ни как не могу додуматься.

Answer 1

[Сергей delphinpro]

var drowSnowman = function(x, y) {
....
drawCircle(x+100, y+100, 30, true);
drawCircle(x+100, y+105, 5, false);
…// и т.д

Answer 2

[Роман]

var drowSnowman = function(posX, posY) {
            function drawCircle(x, y, radius, fillCirсle) {
            ctx.beginPath();
            if (fillCirсle === true) {
                ctx.lineWidth = 4;
                ctx.arc(x, y, radius, 0, Math.PI * 2, false);
                ctx.stroke();
            } else if (fillCirсle === false) {
                ctx.arc(x, y, radius, 0, Math.PI * 2, false);
                ctx.fill();
            }
        };
        
        drawCircle(posX+100, posY+100, 30, true);
        ctx.fillStyle = "orange";
        drawCircle(posX+100, posY+105, 5, false);
        ctx.fillStyle = "black";
        drawCircle(posX+90, posY+95, 5, false);
        drawCircle(posX+110, posY+95, 5, false);
        drawCircle(posX+100, posY+170, 40, true);
        drawCircle(posX+100, posY+150, 5, false);
        drawCircle(posX+100, posY+170, 5, false);
        drawCircle(posX+100, posY+190, 5, false);
};

drowSnowman(200,150);
drowSnowman(500,450);

Answer 3

[Сергей Зенькович]

Как вариант так:

var drowSnowman = function(a, b) {
function drawCircle(x, y, radius, fillCirсle) {
ctx.beginPath();
if (fillCirсle === true) {
ctx.lineWidth = 4;
ctx.arc(x, y, radius, 0, Math.PI * 2, false);
ctx.stroke();
} else if (fillCirсle === false) {
ctx.arc(x, y, radius, 0, Math.PI * 2, false);
ctx.fill();
}
};

drawCircle(a, b, 30, true);
ctx.fillStyle = "orange";
drawCircle(a, b+5, 5, false);
ctx.fillStyle = "black";
drawCircle(a-10, b-5, 5, false);
drawCircle(a+10, b-5, 5, false);
drawCircle(a, b+70, 40, true);
drawCircle(a, b+50, 5, false);
drawCircle(a, b+70, 5, false);
drawCircle(a, b+90, 5, false);
};

drowSnowman(100,100);