Creating shapes but wrong output values

Question

I'm creating shapes accordingly to how I assign numbers in an array.

For example:

var draw:Shape = new Shape();
var map:Array = [
[0,1,1,0,0],
[0,0,1,1,0]
]

for (var i:int = 0; i < map.length - 1; i++)
{
    for (var j:int = 0; j < map[0].length - 1; j++)
    {
        if (map[i][j] == 1)
        {
            draw.graphics.beginFill(1,1);
            draw.graphics.drawEllipse(j * 25, i * 25, 25, 25);
            draw.graphics.endFill();

            trace(draw.x);
        }
    }
}

It created the ellipses perfectly how I wanted, however, the problem lies with the trace function as it will display the value 0 only. Why is that? Shouldn't it trace the x coordinate within the shape variable 'draw'?

The suppose value when the map array has a 1 in it should be how the math is for x and y but it returns the value as 0 for both x and y whenever I try to trace it or assign the coordinates to somewhere else. Are the x's and y's not traceable? Can I not store the value of draw.x and draw.y somewhere else?

Answer 1

It traces out zero because you never set the x or y value of the draw object (it defaults to 0).

The confusion lies in that the graphics object is a sub/child object of your shape. So draw is your shape/display object, draw.graphics is your actual ellipse(s). Graphics objects do not inherit from DisplayObject so they do not have DisplayObject properties like x/y/width/height - they are just instructions for drawing something and are rastered out as one entity regardless of how many times you begin/end fill or draw.

While you have access to the raw graphics data via graphics.readGraphcisData, which you could probably parse out an individual shape, there is no easy way to get the x/y of an individual ellipse if they are all drawn into the same graphics object.

If you explained in your question what you are actually trying to accomplish, a recommended solution can then be given.

Most likely, you'll want break out your ellipses into their own shape object (if you need them to be individual entities that can be changed later):

var draw:Sprite = new Sprite();
var map:Array = [
[0,1,1,0,0],
[0,0,1,1,0]
]

for (var i:int = 0; i < map.length - 1; i++)
{
    for (var j:int = 0; j < map[0].length - 1; j++)
    {
        if (map[i][j] == 1)
        {
            var ellipse:Shape = new Shape();
            ellipse.graphics.beginFill(1,1);
            ellipse.graphics.drawEllipse(0, 0, 25, 25);
            ellipse.graphics.endFill();

            ellipse.x = i * 25; ellipse.y = i * 25;

            draw.addChild(ellipse);
            trace(ellipse.x);
        }
    }
}

If you just want the previously drawn ellipse, just store that info as you draw it:

var ellipse:Rectangle = new Rectangle(0,0,25,25);

for (var i:int = 0; i < map.length - 1; i++)
{
    for (var j:int = 0; j < map[0].length - 1; j++)
    {
        if (map[i][j] == 1)
        {
            ellipse.x = i * 25;
            ellipse.y = i * 25;

            draw.graphics.beginFill(1,1);
            draw.graphics.drawEllipse(ellipse.x, ellipse.y, ellipse.width, ellipse.height);
            draw.graphics.endFill();

            trace(ellipse.x);
        }
    }
}