In the equisigned projection, there is no disappearing point. The observer's eyes are always parallel, and the Projection Direction and coordinate axis angle are fixed values. Although it looks slightly distorted, the stereoscopic effect is obvious in general, the important thing is that no matter where you place the stereoscopic image formed by the equisigned projection on the screen, it looks the same.
The author of the original book also gave a demonstration to help you understand: Online demonstration
Obviously: the top surface of a cube (square) is deformed on the screen after an equal-angle projection and becomes a diamond. (Click the true isometric button in the online demonstration just now to observe the top of the cube in the front view)
Is the diamond produced by the square after the standard equisigned projection. The angle on the left and right side of the square is 60 degrees. By calculation, the length-width ratio is 1.73, but this ratio is usually calculated, the number of decimal places will be displayed, and the number of decimal places will be annoying (because the length or width must be set to the decimal place when drawing with PS and other software)
Therefore, in actual situations, it is more often used to replace the "second-class corner" (click the dimetric button in the online demonstration just now to observe the top of the cube in the front view)
It can be seen that the diamond formed by "second-class angle projection" is more flat than "equal-angle projection", but the width/high ratio of this image is exactly 2, which is easy to process and memory.
With the above foundations, we can do some real-time work and think about a problem: the graphics in the conventional 3D space are projected by the second-class angle (for convenience, what is the calculation (or conversion) after second-class angle projection is called an equal-angle projection?
Given that any geometric image is always composed of several points, we first define a conventional point3d class:
+ View code?
123456789101112 |
package { public class Point3D { public var x: Number ; public var y: Number ; public var z: Number ; public function Point3D(x: Number = 0 ,y: Number = 0 ,z: Number = 0 ) { this .x=x; this .y=y; this .z=z; } } } |
So the above problem can also be simplified to: how to convert 3D coordinate points into 2D coordinate points on the computer screen in an equal-angle space? (Or vice versa ?)
Conversion Formula: X1 = x-Z Y1 = y * 1.2247 + (x + Z) * 0.5 Z2 = (x + Z) * 0.866-y * 0.707 -- used for deep layer sorting, you can ignore
The above formula can convert the coordinate points in the same angular space into coordinate points in the screen space. (I suggest you remember this as a theorem formula. After all, we are not studying mathematics)
This formula can be encapsulated into isoutil. As for future reuse convenience.
+ View code?
123456789101112131415161718192021222324 |
package { import flash.geom.Point; public class IsoUtils { //public static const Y_CORRECT:Number=Math.cos(- Math.PI/6)*Math.SQRT2; public static const Y_CORRECT: Number = 1.2247448713915892 ; // Converts a 3D coordinate point in an equisigned space into a 2D coordinate point on the screen. public static function isoToScreen(pos:Point3D):Point { var screenX: Number =pos.x-pos.z; var screenY: Number =pos.y*Y_CORRECT+(pos.x+pos.z)* 0.5 ; return new Point(screenX,screenY); } // Converts the 2D coordinate points on the screen into a 3D coordinate point in an equal-angle space. public static function screenToIso(point:Point):Point3D { var xpos: Number =point.y+point.x*. 5 ; var ypos: Number = 0 ; var zpos: Number =point.y-point.x*. 5 ; return new Point3D(xpos,ypos,zpos); } } } |
Use code to draw an equal-Angle Image and test whether the above Code is correct.
+ View code?
12345678910111213141516171819202122232425262728293031323334353637383940 |
package { import flash.display.Sprite; import flash.display.StageAlign; import flash.display.StageScaleMode; import flash.geom.Point; [SWF(backgroundColor= 0xefefef ,height= "200" ,width= "300" )] public class IsoTransformTest extends Sprite { public function IsoTransformTest() { stage.align=StageAlign.TOP_LEFT; stage.scaleMode=StageScaleMode.NO_SCALE; var p0:Point3D= new Point3D( 0 , 0 , 0 ); var p1:Point3D= new Point3D( 100 , 0 , 0 ); var p2:Point3D= new Point3D( 100 , 0 , 100 ); var p3:Point3D= new Point3D( 0 , 0 , 100 ); var sp0:Point=IsoUtils.isoToScreen(p0); var sp1:Point=IsoUtils.isoToScreen(p1); var sp2:Point=IsoUtils.isoToScreen(p2); var sp3:Point=IsoUtils.isoToScreen(p3); var tile:Sprite = new Sprite(); tile.x= 150 ; tile.y= 50 ; addChild(tile); tile.graphics.lineStyle( 0 ); tile.graphics.moveTo(sp0.x, sp0.y); tile.graphics.lineTo(sp1.x, sp1.y); tile.graphics.lineTo(sp2.x, sp2.y); tile.graphics.lineTo(sp3.x, sp3.y); tile.graphics.lineTo(sp0.x, sp0.y); trace (Math.cos(- Math.PI/ 6 )*Math.SQRT2); //1.2247448713915892 trace (tile.width,tile.height); // 200 100 conforms to the mentioned above } } } |
Equality projection and Calculation Formula