二维扭曲

二维扭曲原理

    • 二维扭曲的基本原理是二维图形的顶点进行扭曲处理,为了扭曲效果更佳真实,扭曲更佳平和,需要将二维图形切分成很多个小块,即由很多个小三角形组成一个大的二维图形。具体如下图。

      二维扭曲_第1张图片

    • 当一个二维图形有很多个小三角形组成时,便可以对其进行很真实的扭曲了,详细的扭曲原理如下。

      二维扭曲_第2张图片

      • 首先,假设扭曲中心点为O,其坐标为(X0,Y0),绕中心扭动的点为D,其坐标为(X1,Y1)。
      • 设点D在X方向上相对于O点的偏移量为XSpan,Y方向上相对于O点的偏移量为YSpan,那么有如下公式:
        XSpan=X1-X0
        YSpan=Y1-Y0
        OD=$\sqrt{XSpan^2+YSpan^2}$
      • 有了XSpan与YSpan的值后可以很方便的求出OD与X轴的夹角θ,具体情况如下:
        当XSpan=0时,YSpan>0时,θ=90o;
        当XSpan=0时,YSpan<0时,θ=270o;
        当XSpan!=0时,那么θ=atan(YSpan/XSpan);
      • 计算出θ角后,便可以进一步计算D点旋转后OD与X轴的夹角θ':
        θ'=θ+ratio*OD;
            提示:ratio是与当前D点旋转角度相关的一个系数,通过将其与OD相乘,可以使二维图形OD射线上不同距离处产生不同程度的扭曲,同时在程序运行过程中,ratio是不断更新且连续变化的,因此可以产生动画效果。
      • 计算出旋转后的角度θ'后就可以求出旋转后的点X、Y坐标了:
        X1'= X0+ OD×cos(θ')
        Y1'= Y0+ OD×sin(θ')

    你可能感兴趣的:(图形学,图形学,二维扭曲,图像扭曲)