在透视某物时改变位置

Question

我想在透视图中绘制一个网格，并在左下角绘制一个圆圈。 但我无法做到这一点。

所以，首先我画一个没有透视的网格和圆圈。

public class test extends MovieClip
    {
        private var _gridSprite:Sprite;
        private var _xLineHolder:Sprite;
        private var _yLineHolder:Sprite;
        private var _circle:Sprite;

        public function test()
        {
            init();
        }

        private function init()
        {
            _gridSprite = new Sprite();
            this.addChild(_gridSprite);

            _xLineHolder = new Sprite();
            _gridSprite.addChild(_xLineHolder);
            _yLineHolder = new Sprite();
            _gridSprite.addChild(_yLineHolder);

            draw();

            _circle = new Sprite();         
            _circle.graphics.beginFill(0xFF0000);
            _circle.graphics.drawCircle(0, 0, 5);
            this.addChild(_circle);

                   //Here do I set the position of the circle
            _circle.x = _gridSprite.width + _gridSprite.x;
            _circle.y = _gridSprite.height + _gridSprite.y;
        }

        private function draw()
        {
            var spaceXDiv:Number = 160/20;
            var spaceYDiv:Number = 160/20;

            _xLineHolder.graphics.clear();
            _yLineHolder.graphics.clear();

            _xLineHolder.graphics.lineStyle(1);
            _yLineHolder.graphics.lineStyle(1);

            for(var i:int = 0; i <= spaceXDiv; i++){
                _xLineHolder.graphics.moveTo(i * 20, 0);
                _xLineHolder.graphics.lineTo(i * 20, 160);
            }

            for(var j:int = 0; j <= spaceYDiv; j++){
                _yLineHolder.graphics.moveTo( 0, j * 20);
                _yLineHolder.graphics.lineTo(160, j * 20);
            }
        }
    }

使用此代码，我得到以下结果

这没关系，圆圈在左下角。

现在我在init()中设置网格的视角。我使用rotationY（我不知道这是否正确）。角度是20度。

_gridSprite = new Sprite();
this.addChild(_gridSprite);
_gridSprite.rotationY = -20;

结果不再正常。圆圈不再位于网格的左下角。

我的问题是：如何更改圆圈的位置，使其位于网格的左下角？

我尝试了很多，但我的数学不再那么好了。 这是不将圆圈放在左下角的示例代码。

var gridLeft:Number = _gridSprite.width + _gridSprite.x;
_circle.x = gridLeft - gridLeft * Math.tan(20 * Math.PI / 180);

var gridBottom:Number = _gridSprite.height + _gridSprite.y;
_circle.y = gridBottom - gridBottom * Math.tan(20 * Math.PI / 180);

我希望你理解我的问题，你可以帮助我。

谢谢，

文森特

Answer 1

我认为你的问题太复杂了。您只需要在同一容器中旋转网格和圆。在这种情况下，您的'test'类是容器，但您始终可以创建另一个sprite作为容器。

因此，如果您想同时旋转网格和圆圈，只需执行this.rotationY = -20而不是_gridSprite.rotationY = -20;