Unity 3D : Catmull-Rom 樣條插值

前言 :

Catmull-Rom 樣條插值 ( Catmull-Rom Spline Interpolating ) 是一種常用方法，例如我們要做人物移動，要沿路經過所有指定的位置，如果用直線插值，在移動中碰到轉彎時會很不自然，最好像個可以平滑轉彎，那麼就會需要用到曲線差值。

而 Catmull-Rom 的優勢是保證曲線經過指定位置，像是貝茲曲線他就不會經過指定位置，在一些場合下 Catmull-Rom 會比其他曲線方便使用。

下面就是我用 Catmull-Rom 畫出的結果，讓我們來看程式碼吧。

我做成一個 Library ( CatmullRom.cs )，可以很方便的使用曲線插值。

下面這張圖的輸出結果一樣，但是分別用不同方法實現 : Interp2D ( ) 與 EasyInterp2D ( )。

EasyInterp2D ( ) 是方便使用，但性能較差，但兩點就能畫出直線。

Interp2D ( ) 是高性能，但需要四個點畫出直線，而且劃出的直線只有中間兩個點，頭尾它不會顯示。

所以 Interp2D ( ) 要與 EasyInterp2D ( ) 達到相同功能，那麼頭尾就必須宣告兩次相同的才行。

執行結果 :

Test.cs

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
using MathTool.Curve;

public class Test : MonoBehaviour {

    public RawImage img, img2;

    void Start()
    {
        // ------------------------------------------------------------------
        // 示範 EasyInterp2D 用法 ( 較方便 )

        Texture2D t = new Texture2D(512, 512);

        Vector2[] pvs = {
            new Vector2(0,0),
            new Vector2(168,84),
            new Vector2(336,420),
            new Vector2(512,512)
        };


        for (int i = 0; i < t.width; i++)
        {
            Vector2 v = CatmullRom.EasyInterp2D(pvs, i / (float)t.width);
            t.SetPixel((int)v.x, (int)v.y, Color.red);
        }

        t.Apply();

        img.texture = t;


        // ------------------------------------------------------------------
        // 示範 Interp2D 用法 ( 性能較好, 少了迴圈, 可調性高 )
        // 由於 Interp2D 頭尾不顯示，所以頭尾需要宣告兩次 !

        Texture2D t2 = new Texture2D(512, 512);

        Vector2[] pvs2 = {
            new Vector2(0,0),
            new Vector2(0,0),
            new Vector2(168,84),
            new Vector2(336,420),
            new Vector2(512,512),
            new Vector2(512,512)
        };

        for (int i = 0; i < t.width; i++)
        {
            Vector2 v = CatmullRom.Interp2D(pvs2, i / (float)t.width);
            t2.SetPixel((int)v.x, (int)v.y, Color.blue);
        }

        t2.Apply();

        img2.texture = t2;
    }
}

CatmullRom.cs

using UnityEngine;

// Catmull-Rom Spline Interpolating

namespace MathTool.Curve
{
    public class CatmullRom
    {
        //曲线插值函数 2D : 如果要顯示所有陣列數據這較方便 ( 可顯示頭尾, 兩個點也能顯示 )
        public static Vector3 EasyInterp2D(Vector2[] pts, float t)
        {
            Vector2[] v = new Vector2[pts.Length + 2];
            v[0] = pts[0];
            v[v.Length - 1] = pts[pts.Length - 1];
            for (int i = 0; i < pts.Length; i++)
            {
                v[i + 1] = pts[i];
            }
            return Interp2D(v, t);
        }

        //曲线插值函数 3D : 如果要顯示所有陣列數據這較方便 ( 可顯示頭尾, 兩個點也能顯示 )
        public static Vector3 EasyInterp3D(Vector3[] pts, float t)
        {
            Vector3[] v = new Vector3[pts.Length + 2];
            v[0] = pts[0];
            v[v.Length - 1] = pts[pts.Length - 1];
            for (int i = 0; i < pts.Length; i++)
            {
                v[i + 1] = pts[i];
            }
            return Interp3D(v, t);
        }

        //曲线插值函数 2D : 原始方法 ( 頭尾不顯示, 注意 : 要四個點(含)以上才行 ! )
        public static Vector3 Interp2D(Vector2[] pts, float t)
        {
            int numSections = pts.Length - 3;
            int currPt = Mathf.Min(Mathf.FloorToInt(t * (float)numSections), numSections - 1);
            float u = t * (float)numSections - (float)currPt;

            Vector2 a = pts[currPt];
            Vector2 b = pts[currPt + 1];
            Vector2 c = pts[currPt + 2];
            Vector2 d = pts[currPt + 3];

            return .5f * (
                (-a + 3f * b - 3f * c + d) * (u * u * u)
                + (2f * a - 5f * b + 4f * c - d) * (u * u)
                + (-a + c) * u
                + 2f * b
            );
        }

        //曲线插值函数 3D : 原始方法 ( 頭尾不顯示 )
        public static Vector3 Interp3D(Vector3[] pts, float t)
        {
            int numSections = pts.Length - 3;
            int currPt = Mathf.Min(Mathf.FloorToInt(t * (float)numSections), numSections - 1);
            float u = t * (float)numSections - (float)currPt;

            Vector3 a = pts[currPt];
            Vector3 b = pts[currPt + 1];
            Vector3 c = pts[currPt + 2];
            Vector3 d = pts[currPt + 3];

            return .5f * (
                (-a + 3f * b - 3f * c + d) * (u * u * u)
                + (2f * a - 5f * b + 4f * c - d) * (u * u)
                + (-a + c) * u
                + 2f * b
            );
        }
    }
}

參考 :

Unity 3D：游戏分解之曲线 :
https://www.cnblogs.com/fishyu/p/6817509.html

贝塞尔曲线初探 :
http://www.cnblogs.com/jay-dong/archive/2012/09/26/2704188.html