Как для canvas объектов указать положение на сцене?

Question

[Игорь]

var setting={
        maxCount:40
    };
       
    function createPAtch(max){
        for(var i=0; i<max; i++){
//            var patchObj= new Patch;
//            patchObj.id=i;
//            patchArray.push(patchObj);
        var randColorCount=Math.floor(Math.random()*12);
            console.log(Math.floor(Math.random()*window.innerWidth));

      var randPosX=Math.floor(Math.random()*window.innerWidth);
      var randPosY=Math.floor(Math.random()*window.innerHeight);
      
      context.beginPath();
      context.moveTo(randPosX, randPosY);
            

      // line 1
      context.lineTo(randPosX, randPosY);

      // quadratic curve
      context.quadraticCurveTo(230, 200, 250, 120);

      // bezier curve
      context.bezierCurveTo(290, -40, 300, 200, 400, 150);

      // line 2
      context.lineTo(500, 90);

      context.lineWidth = 5;
      context.strokeStyle = ballColors[randColorCount];
      context.stroke();
      context.positionX= Math.floor(Math.random()*window.innerWidth);
      context.positionY= Math.floor(Math.random()*window.innerHeight);
            
            
       
       
        };
    };
    
       createPAtch(setting.maxCount);

как создать отдельный объект context.lineTo чтобы он содержал в себе все чорточки и линии.
чтоб потом к нему можно было обращаться и его перемешать по сцене и тд

я хочу чтобы весь этот объект был отдельным и не просто разными линиями

Answer 1

[Евгений]

Заведите массив и туда складывайте все получившиеся рандомные координаты, далее уже работайте с этими координатами:

var lineObjects = [];

function createPAtch(max) {
    // ...
    var randPosX=Math.floor(Math.random()*window.innerWidth);
    var randPosY=Math.floor(Math.random()*window.innerHeight);

    lineObjects.push({ x: randPosX, y: randPosY });
    // ...
}

Comments

[Игорь]

и как их на сцену добавить?

[Евгений]

Игорь Николаевич: Потом проходите по массиву и отрисовывайте\изменяйте эти координаты

[Игорь]

Евгений: x=randPosX;
y=randPosY;
width=30;
height=30;

ctx.fillRect(x, y, width, height);

на сцену как добавить????
я ведь создаю разные куски линий.....