关于坐标旋转

在看<Flash actionscript动画教程>(中文版)的第十章的第二节,它提到“高级坐标旋转”,书中只给出了一个基本公式:

x1 = cos(angle) * x – sin(angle) * y; y1 = cos(angle) * y + sin(angle) * x;

书上并没有写如何来分析、证明这个公式,所以就自己琢磨了一下。

有如下的所示的图,如果有一个圆,它的圆心距离以某一点为参考点(原点)不变,而绕着它旋转某一角度后,希望得到新的坐标。

==> 已经圆心距离“原点”它的坐标为(x, y),现在希望求得在它绕“原点”旋转一定角度(angle)后,新的坐标(x1, y1)

假设初始坐标(x, y)与X轴形成的一个角度为A,记圆心距离“原点”的长度为 d = Math.sqrt(x * x + y * y);

sin(A) = y / d; cos(A) = x / d;

x1 = d * cos(A + angle);

=>

x1 = d * (cos(A)*cos(angle) – sina(A)*sin(angle));

x1 = d * cos(A) * cos(angle) – d * sin(A) * sin(angle);

x1 = d * (x / d) * cos(angle) – d * (y / d) * sin(angle);

x1 = x * cos(angle) – y * sina(angle);

y1 = d * sin(A + angle);

=>

y1 = d * (sin(A)*cos(angle)  + cos(A)*sin(angle));

y1 = d * sin(A) * cos(angle) + d * cos(A) * sin(angle);

y1 = d * (y / d) * cos(angle) + d * (x / d) + sin(angle);

y1 = y * cos(angle) + x * sin(angle);

主要用到了以下两个公式:

sin(A+B) = sin(A) * cos(B) + cos(A) * sin(B);

cos(A+B) = cos(A) * cos(B) – sin(A) * sin(B);

最后用这个公式写一个简单的例子

一个Ball类,还有一个测试类。

Ball类:

package {
    import flash.display.Sprite;
    
    public class Ball extends Sprite {
        private var radius:Number;
        private var color:uint;
        
        public function Ball(radius:Number = 40, color:uint = 0xff0000){
            this.radius = radius;
            this.color = color;
            init();
        }
        
        public function init():void {
            graphics.beginFill(color);
            graphics.drawCircle(0, 0, radius);
            graphics.endFill();            
        }
        
    }
}

用于测试的类

package  
{
    import flash.display.Sprite;
    import flash.events.Event;
    
    /**
     * ...
     * @author ...
     */
    public class Rotate2 extends Sprite
    {
        
        private var ball:Ball;
        private var vr:Number = .05;
        private var cos:Number = Math.cos(vr);
        private var sin:Number = Math.sin(vr);
        
        public function Rotate2() 
        {
            init();
        }
                
        private function init():void
        {
            ball = new Ball();
            addChild(ball);
            
            ball.x = Math.random() * stage.stageWidth;
            ball.y = Math.random() * stage.stageHeight;
            
            addEventListener(Event.ENTER_FRAME, onEnterFrame);
        }
        
        private function onEnterFrame(evt:Event):void
        {
            var x1:Number = ball.x - stage.stageWidth / 2;
            var y1:Number = ball.y - stage.stageHeight / 2;
            var x2:Number = cos * x1 - sin * y1;
            var y2:Number = cos * y1 + sin * x1;
            
            ball.x = stage.stageWidth / 2 + x2;
            ball.y = stage.stageHeight / 2 + y2;
        }
    }
    
}

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏懒人开发

(10.5)James Stewart Calculus 5th Edition:Conic Sections

832
来自专栏逍遥剑客的游戏开发

RenderMonkey在数字图像处理中的应用

2148
来自专栏闪电gogogo的专栏

Matplotlib

1562
来自专栏儿童编程

Processing雁群实验(续)

(1)旋转复杂不规则图形; (2)运用二维数组定义图形; (3)鼠标左右移动控制物体沿 Y 轴旋转; (4)点击鼠标线条变色。

1442
来自专栏数据小魔方

sparklines迷你图系列5——Evolution(Horizon)

今天跟大家分享区域(面积图)图的一个变体——水平线图。 之所以说是面积图的变体,因为这种水平线图,表达的信息与面积图几乎差不多,差别仅仅在图表呈现形式上。 ? ...

3206
来自专栏mySoul

css的2D转换

下面通过css实现动画效果,可以使用脚本化的css实现滑入,轮廓伸缩的列表,即动态的HTML,一个过时的说法DHTML

1090
来自专栏jojo的技术小屋

原 CSS3 filter

作者:汪娇娇 日期:2016.10.9 其实之前几乎都没用过filter属性,就算知道也只是在脑中留了点浅浅的印象,直到最近因为项目的原因,才对filter进行...

2053
来自专栏为数不多的Android技巧

Xfermode in android

Xfermode有三个实现类:AvoidXfermode, PixelXorXfermode以及PorterDuffXfermode。 前两个类因为不支持硬件加...

1994
来自专栏yl 成长笔记

three.js 相机

图形学中的相机定义了三维空间到二维屏幕的投影方式,根据投影方式的不同,相机可分为 正交投影相机 与 透视投影相机。

1292
来自专栏PPV课数据科学社区

数据挖掘知识脉络与资源整理(七)–饼图

? ? 简介 饼图英文学名为Sector Graph, 有名Pie Graph。常用于统计学模块。2D饼图为圆形,手画时,常用圆规作图。 仅排列在工作表的一...

2967

扫码关注云+社区

领取腾讯云代金券