> For the complete documentation index, see [llms.txt](https://lee-seokhyun.gitbook.io/game-programming/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://lee-seokhyun.gitbook.io/game-programming/client/easy-mathematics/gdc2012/splines.md).

# 스플라인(Splines)

지금까지 곡선에 대해서 충분히 배운것 같습니다.

이제 스플라인이 뭔지 알아보도록 하죠.

스플라인이란 곡선들이 이어진 모습이라고 보면 됩니다.

![](https://3665878343-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LngmcDPWb1XA1VNz9ii%2F-LpqeAxEGOE532Elt3Pf%2F-Lpqf6Wkitgepj8UNa-L%2Fimage.png?alt=media\&token=22af64dc-9710-472b-a2d3-ac39d8ab5380)

![](https://3665878343-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LngmcDPWb1XA1VNz9ii%2F-LpqeAxEGOE532Elt3Pf%2F-LpqfAabcBp62KkcBmsl%2Fimage.png?alt=media\&token=cc41c925-8477-4bb0-acd5-7e708d48a1ef)

![](https://3665878343-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LngmcDPWb1XA1VNz9ii%2F-LpqeAxEGOE532Elt3Pf%2F-LpqfDm5RRAudpisHdBt%2Fimage.png?alt=media\&token=ea742418-351a-4c3f-891d-dfa67e241d76)

![](https://3665878343-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LngmcDPWb1XA1VNz9ii%2F-LpqeAxEGOE532Elt3Pf%2F-LpqfFxMz8BkoOUEoVSE%2Fimage.png?alt=media\&token=4b2fee53-9c4c-4ea6-9cd3-83689a823899)

각 곡선들을 이어주는 지점을 **노트**(knot)라고 부릅니다. 이전 곡선의 끝점과 다음 곡선의 시작점을 연결시켜주는 부분이죠.

![](https://3665878343-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LngmcDPWb1XA1VNz9ii%2F-LpqeAxEGOE532Elt3Pf%2F-Lpqfiev_auWNhjcsArW%2Fimage.png?alt=media\&token=f4fbeba9-a7eb-4a4d-9aa3-05e47dcb4ba6)

베지어 곡선에서 파라미터 t를 사용하여 곡선 위의 지점을 구했는데, 스플라인에서도 마찬가지로 t값에 대해서 생각해볼 수 있습니다.\
조금 다른 부분은 전체 스플라인에 대한 t값과 각각의 곡선에 대한 t값으로 구분지어 생각할 수 있다는 것이죠.

스플라인에서의 t값(spline\_t)

```
0부터 시작해서, 스플라인의 끝에 도달하기 전까지 계속 증가합니다.
```

하나의 곡선 안에서의 t값(local\_t)

```
각 곡선의 시작점에서 0으로 초기화 됩니다.
```

4개의 곡선으로 된 스플라인을 예로 들겠습니다.\
0.0 \~ 4.0까지 보간하는 spline\_t값이 있는데,\
만약 spline\_t가 2.67이라면 다음과 같이 생각할 수 있습니다.

세번째 곡선(0, 1, **2**, 3)에서 **67% (local\_t = .67)**\
즉, 2.67에 해당하는 지점은 curve\[**2**].EvaluteAt(**.67**) 로 구할 수 있는 것입니다.

```
P(2.67) = curve[2].EvaluteAt(.67)
```

아래 그림과 함께 spline\_t를 0.0 에서 4.0까지 보간해 보겠습니다.

![](https://3665878343-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LngmcDPWb1XA1VNz9ii%2F-LpqkVRWimD2pUqU-oSU%2F-LpqkgIGFDHDb6nyPnBX%2Fimage.png?alt=media\&token=b92bf238-8b86-48f7-be1d-0d248c73b2d7)

![](https://3665878343-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LngmcDPWb1XA1VNz9ii%2F-LpqkVRWimD2pUqU-oSU%2F-LpqkkHMT6u_pCSfTodQ%2Fimage.png?alt=media\&token=20524578-9a7e-46dc-99c4-0fb7e869ae5a)

![](https://3665878343-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LngmcDPWb1XA1VNz9ii%2F-LpqkVRWimD2pUqU-oSU%2F-LpqkmAZPXOuGlmCtkCP%2Fimage.png?alt=media\&token=dfe3111f-264e-467e-a8d5-abe979880891)

![](https://3665878343-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LngmcDPWb1XA1VNz9ii%2F-LpqkVRWimD2pUqU-oSU%2F-Lpqkohyuk5KeSXe9JMj%2Fimage.png?alt=media\&token=9bb60d5c-927f-4f94-bc2a-995f52c2895e)

![](https://3665878343-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LngmcDPWb1XA1VNz9ii%2F-LpqkVRWimD2pUqU-oSU%2F-LpqkqYb0JDwc-TpIUID%2Fimage.png?alt=media\&token=dbd8579f-f64c-44de-9f65-f93e49619cc4)

![](https://3665878343-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LngmcDPWb1XA1VNz9ii%2F-LpqkVRWimD2pUqU-oSU%2F-Lpqks_jBrLDFM8EWNtH%2Fimage.png?alt=media\&token=5586e5b2-ce33-4db6-9a38-a940f58875d9)

![](https://3665878343-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LngmcDPWb1XA1VNz9ii%2F-LpqkVRWimD2pUqU-oSU%2F-LpqkwA91965KghrJbxJ%2Fimage.png?alt=media\&token=51d01ad9-f4db-4823-9a13-2e43b0507b78)

![](https://3665878343-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LngmcDPWb1XA1VNz9ii%2F-LpqkVRWimD2pUqU-oSU%2F-LpqkyOSmnQI2xbbuanN%2Fimage.png?alt=media\&token=dda2eaab-2f51-435b-8668-f86b2b7a42e1)

![](https://3665878343-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LngmcDPWb1XA1VNz9ii%2F-LpqkVRWimD2pUqU-oSU%2F-Lpql-EmovRix_9NqSA6%2Fimage.png?alt=media\&token=8c078430-cdc1-4173-af4f-a0f3f92eb3a4)