PixyJs. Почему у объекта Graphics x и y =0?

Question

[Egorian]

let app = createfield(60,10,10);
function createfield(seg_size,stage_height, stage_width) {
 let app = new  PIXI.Application(
     {
         width:seg_size * stage_width,
         height:seg_size * stage_height,
         antialias: true,    // default: false
         transparent: false, // default: false
         resolution: 1
     });
    PIXI.loader.load(function () {
       let cur_x=0;
       let cur_y=0;
       for(let i=0;i<stage_height;i++){
           for(let i=0;i<stage_width;i++){
               let rectangle = new PIXI.Graphics();
               rectangle.beginFill(0x66CCFF);
               rectangle.lineStyle(4, 0xFF3300, 1);
               rectangle.drawRect(cur_x,cur_y,seg_size,seg_size);


               rectangle.endFill();
               rectangle.interactive = true;
               rectangle.buttonMode = true;

               app.stage.addChild(rectangle);
               
               rectangle.on('mousedown', function () {
                   console.log(this.x);
               });
               cur_x+=seg_size;
           }
           cur_x=0;
           cur_y+=seg_size;
       }

    });
    return app


}

Эта функция создает Application которая заполнена квадратами. Мне нужно чтобы при нажатии на квадрат я получал его координаты, но при получении x или y через this.x(this.position.x) эти значения равны нулю.
Выводил просто this, и у объекта везде x и y равны нулю. Почему так? И как получить его позицию?

Answer 1

[0xD34F]

Почему? Ну, наверное, потому что это дефолтное значение. Хотите, чтобы был не 0 - вместо рисования прямоугольников чёрт знает где делайте соответствующую трансформацию, а сам прямоугольник рисуйте в (0, 0). Т.е., вместо

rectangle.drawRect(cur_x,cur_y,seg_size,seg_size);

будет

rectangle.drawRect(0, 0, seg_size, seg_size);
rectangle.setTransform(cur_x, cur_y);