簡體   English   中英

如何使用透視投影獲取DisplayObject的可見大小

[英]How to get visible size of DisplayObject with perspective projection

以下完全是一個數學問題。

眾所周知, PerspectiveProjection根據以下公式,以fieldOfViewfocalLength的相互依賴值表示的3D透視圖轉換:

focalLength = stageWidth/2 * (cos(fieldOfView/2) / sin(fieldOfView/2)

BjørnGunnar Staal的插圖
(來源: bgstaal.net

問: 如何獲取已應用PerspectiveProjection的DisplayObject(在上面鏈接的圖像上為多維數據集)的可見屏幕大小?

有關ActionScript 3中問題的更詳盡的描述和說明性代碼缺少DisplayObject可見范圍的功能

我想我沒說清楚。

我在ide中做了一個簡單的測試,將3個剪輯放在一起,如下所示: 3D尺寸

寬度和高度報告可見3d區域的大小,您也可以在屬性檢查器中看到。 您可以像訪問一樣簡單

trace(cube.width + ' by ' + cube.height);

在運行時或使用jsfl:

var doc = fl.getDocumentDOM();
fl.outputPanel.clear();
fl.trace(doc.selection[0].width + ' by ' + doc.selection[0].height);

在IDE中在創作時針對一個選定的剪輯。

我用一些動作腳本做了類似的測試:

//draw faces
var front:Sprite = drawFace();
var back:Sprite = drawFace();
var left:Sprite = drawFace();
var right:Sprite = drawFace();
var top:Sprite = drawFace();
var bottom:Sprite = drawFace();
//transform faces
front.z  = -50;
back.z   =  50;
left.x   = -50;
right.x  =  50;
top.y    = -50;
bottom.y =  50;
left.rotationY = right.rotationY = 90;
top.rotationX = bottom.rotationX = 90;
//putem them all together
var cube:Sprite = new Sprite();
cube.addChild(front);
cube.addChild(back);
cube.addChild(left);
cube.addChild(right);
cube.addChild(top);
cube.addChild(bottom);
addChild(cube);
cube.x = stage.stageWidth * .5;
cube.y = stage.stageHeight* .5;
cube.z = -100;
cube.rotationX = cube.rotationY = 30;

trace(cube.width + ' by ' + cube.height);
trace(cube.getBounds(this));
trace(cube.transform.pixelBounds);
this.addEventListener(Event.ENTER_FRAME, loop);
function loop(event:Event):void {
    cube.rotationY += 3;
    var b:Rectangle = cube.getBounds(this);
    graphics.clear();
    graphics.lineStyle(1,0x009900);
    graphics.drawRect(b.x,b.y,b.width,b.height);
}

function drawFace():Sprite{
    var s:Sprite = new Sprite();
    s.graphics.beginFill(0x000099,.5);
    s.graphics.drawRect(-50,-50,100,100);
    s.graphics.endFill();
    return s;
}

這是《 ActionScript 3.0》的修改后示例

package {  
    import flash.display.*  
    import flash.events.*;  
    import flash.utils.getTimer;  
    import flash.geom.*;

    public class Triangles extends Sprite {  
        var x1:Number = -100,y1:Number = -100,z1:Number = 0,t1:Number = 0;  
        var x2:Number = 100,y2:Number = -100,z2:Number = 0,t2:Number = 0;  
        var x3:Number = 100,y3:Number = 100,z3:Number = 0,t3:Number = 0;  
        var x4:Number = -100,y4:Number = 100,z4:Number = 0,t4:Number = 0;  
        var v1 = new Vector3D(-100,-100,0,0);
        var v2 = new Vector3D(100,-100,0,0);
        var v3 = new Vector3D(100,100,0,0);
        var v4 = new Vector3D(-100,100,0,0);
        var focalLength:Number = 200;   
        var indices:Vector.<int>;  

        var container:Sprite;  

        var bitmapData:BitmapData; // texture  
        var imageLoader:ImageLoader;  

        public function Triangles():void {  
            indices =  new Vector.<int>();  
            indices.push(0,1,3, 1,2,3);  

            container = new Sprite(); // container to draw triangles in  
            container.x = 200;  
            container.y = 200;  
            addChild(container);  

            imageLoader = new ImageLoader("head.jpg");  
            imageLoader.addEventListener(Event.COMPLETE, onImageLoaded);  
        }  

        function onImageLoaded(event:Event):void {  
            bitmapData = imageLoader.bitmap.bitmapData; 
            addEventListener(Event.ENTER_FRAME, rotatePlane);  
        }  
        function rotatePlane(event:Event):void {  
            var ticker = getTimer()/1600;  
            z2 = z3 = -(z1 = z4 = 100*Math.sin(ticker));  
            x2 = x3 = -(x1 = x4 = 100*Math.cos(ticker));  

            v2.z = v3.z = -(v1.z = v4.z = 100*Math.sin(ticker));
            v2.x = v3.x = -(v1.x = v4.x = 100*Math.cos(ticker));


            t1 = focalLength/(focalLength + z1);  
            t2 = focalLength/(focalLength + z2);  
            t3 = focalLength/(focalLength + z3);  
            t4 = focalLength/(focalLength + z4);  

            v1.w = focalLength/(focalLength + v1.z);  
            v2.w = focalLength/(focalLength + v2.z);  
            v3.w = focalLength/(focalLength + v3.z);  
            v4.w = focalLength/(focalLength + v4.z);  

            // determine triangle vertices based on t values  
            var vertices:Vector.<Number> = new Vector.<Number>();  
            //vertices.push(x1*t1,y1*t1, x2*t2,y2*t2, x3*t3,y3*t3, x4*t4,y4*t4);  

            vertices.push(v1.x*v1.w,v1.y*v1.w, v2.x*v2.w,v2.y*v2.w, v3.x*v3.w,v3.y*v3.w, v4.x*v4.w,v4.y*v4.w);  
            var uvtData:Vector.<Number> = new Vector.<Number>();  
            uvtData.push(0,0,v1.w, 1,0,v2.w, 1,1,v3.w, 0,1,v4.w);  

            // draw  
            container.graphics.clear();  
            container.graphics.beginBitmapFill(bitmapData);  
            container.graphics.drawTriangles(vertices, indices, uvtData);  
            var b:Rectangle = container.transform.pixelBounds;
            graphics.clear();
            graphics.lineStyle(1,0x009900);
            graphics.drawRect(b.x,b.y,b.width,b.height);
        }  
    }  
} 

pixelBounds在這里可以很好地工作,但這是一個簡單的平面。 pixelBounds在上一個示例中不起作用,但是getBounds()似乎可以正常工作。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM