3

我有一个 2D 图像,我想用真正的 3D 绘制,并围绕它的中心旋转。

我正在使用 Actionscript 3 代码(实际上是 Haxe,没有 IDE),我正在努力通过实验来发现这些值。

我有一个显示对象。如果我使用rotateZ = 45,对象围绕它的左上角旋转,而不是中心;更复杂的Display.transform.matrix事情,比如rotate(Math.PI/4)以同样的方式工作。如何围绕 DisplayObject 的 XY 中心在 Z 轴上旋转?

然后我如何让视角发挥作用?透视图是相对于父对象,还是旋转后的对象?

我在 DisplayObject 实例上使用什么旋转和位置?透视变换的值是什么,我将它们应用到什么对象上?

4

3 回答 3

5

一种非常常见的方法是使用一个枢轴 DisplayObjectContainer,将您的实际平面添加到该容器中,并将其从中心偏移。然后你实际旋转容器。

var pivot : DisplayObjectContainer;

// plane is a display object (e.g. Sprite) that has been created previuosly
// and contains your 2D image.
plane.x = -plane.width/2;
plane.y = -plane.height/2;
pivot.addChild(plane);

pivot.rotationY = 45;

在这里,平面被放置在名为pivot的容器内,并偏移其宽度和高度的一半。这意味着平面显示对象的中心将与容器的注册点(原点)对齐。现在围绕原点旋转容器 ( pivot ) 将围绕同一点旋转它的所有子项,包括平面。

这通常比矩阵变换更容易使用。尤其是 3D 矩阵很容易变得难以理解,除非您对数学很熟悉。

此外,仅修改plane.transform.matrix3D矩阵对象不会影响显示对象,直到您重置矩阵。例如,如果您使用的是补间引擎,这可能会非常乏味,您可能需要一个 UPDATE 事件处理程序来每次重置矩阵,如下所示:

plane.transform.matrix3D = myModifiedMatrix3D;

使用枢轴方法,您可以简单地补间 rotationX/Y/Z 属性。

于 2009-12-21T14:31:06.590 回答
3

我对你的问题有点困惑,但它仍然是一个有趣的问题。

您是否有一些等距工作并想要渲染透视投影视图或其他方式?您有透视图并想要等轴测图?

在 Flash CS4 IDE 中,您可以使用“3D”几个参数进行游戏。我已经将一堆电影剪辑组装成一个立方体来说明这一点。

这是立方体,在 Y 轴上旋转 45 度,然后在 X 轴上旋转 45 度,如变换面板中所示:

闪光透视

这是同一个立方体,在右侧 Property Inspector 的 3D Position And View 组中更改了 Perspective Angle。

闪光等距

IDE中的属性可以通过actionscript来控制。每个 DisplayObject 都有一个 transform 属性,它包含控制 2D 和 3D 属性的对象的引用,例如:Matrix、Matrix3D、PerspectiveProjection等。

您可以通过 PerspectiveProjection 的fieldOfView属性控制透视变形。

假设盒子剪辑被命名为box,我可以将它的 fieldOfView 设置为非常小的值(因为您允许的值仅大于 0 且小于 180 ),就是这样。

例如

var isometric:PerspectiveProjection = new PerspectiveProjection();
isometric.fieldOfView = 0.00001;
box.transform.perspectiveProjection = isometric;

对于轨道,请查看devnet 上的这篇文章。它还解释了一种绕行的方法。根据您要达到的目标,它可能是Ralph Hauwert 的 Arcball 文章

这里有一些 as3 等距库,例如FFilmationas3isolib,但我不确定您到底需要什么。正如 antpaw 所说,如果你在做更大的事情,你可能会使用像PapervisionAway3D这样灵活的 3D API 。

干扰时,我们制作了有趣的等距界面,用于可视化名为Twigital的推文。我们为此使用了papervision。

更新

看来您需要动态地围绕枢轴旋转。您可以使用变换矩阵来做到这一点。以下是您在 2D 中的操作方式:

/**
     * Rotates a matrix about a point defined inside the matrix's transformation space.
     * This can be used to rotate a movie clip around a transformation point inside itself. 
     *
     * @param m A Matrix instance.
     *
     * @param x The x coordinate of the point.
     *
     * @param y The y coordinate of the point.
     *
     * @param angleDegrees The angle of rotation in degrees.
     * @playerversion Flash 9.0.28.0
     * @langversion 3.0
     * @keyword Matrix, Copy Motion as ActionScript    
     * @see flash.geom.Matrix         
     */
    public static function rotateAroundInternalPoint(m:Matrix, x:Number, y:Number, angleDegrees:Number):void
    {
        var point:Point = new Point(x, y);
        point = m.transformPoint(point);
        m.tx -= point.x;
        m.ty -= point.y;
        m.rotate(angleDegrees*(Math.PI/180));
        m.tx += point.x;
        m.ty += point.y;
    }



    /**
     * Rotates a matrix about a point defined outside the matrix's transformation space.
     * This can be used to rotate a movie clip around a transformation point in its parent. 
     *
     * @param m A Matrix instance.
     *
     * @param x The x coordinate of the point.
     *
     * @param y The y coordinate of the point.
     *
     * @param angleDegrees The angle of rotation in degrees.
     * @playerversion Flash 9.0.28.0
     * @langversion 3.0
     * @keyword Matrix, Copy Motion as ActionScript    
     * @see flash.geom.Matrix       
     */
    public static function rotateAroundExternalPoint(m:Matrix, x:Number, y:Number, angleDegrees:Number):void
    {
        m.tx -= x;
        m.ty -= y;
        m.rotate(angleDegrees*(Math.PI/180));
        m.tx += x;
        m.ty += y;
    }

虽然代码不是我的,但它是 Adob​​e 的(我猜是 Robert Penner 的),是MatrixTransformer类的一部分。

现在,对于 3D来说,它更容易了,因为 Matrix3D 类具有像prependRotationappendRotation这样的旋转方法,它们接受 3 个参数:

  • 度数:数字
  • 轴:Vector3D
  • 枢轴点:Vector3D

因此,您可以轻松地将一个框在 X 轴上旋转 30 度,大约 0,0,0,如下所示:

var m:Matrix3D = box.transform.matrix3D;
m.prependRotation(30,Vector3D.X_AXIS,new Vector3D(0,0,0));

再次查看 devnet 文章,Matrix3D 类Vector3D类。

如果你想更深入地了解向量、矩阵和变换,可以查看3D Math Primer,整件事解释得很好,而且只是数学,所以你学到的东西在任何 3d 设置中都很方便(纯as3、away3d、papervision、openGL 等)。

HTH,乔治

于 2009-12-21T11:45:31.377 回答
0

您可以使用对象属性更改视角rotationX, rotationY, rotationZ,但它仅适用于 flashplayer > 9,如果您不想拥有更多控制权,我建议您使用 papervision3d 库(例如相机 fov、缩放等)。

于 2009-12-21T10:54:57.907 回答