티스토리 뷰

반응형

PR 링크: https://github.com/mapbox/mapbox-gl-js/pull/12264

 

 

라인 좌표를 따라 지도를 부드럽게 이동하는 기능을 구현하고 있었다.

특정 좌표로 이동할 때 애니메이션을 적용하면, 가속도가 붙은 효과가 적용된다.

(점점 빨라지면서 출발하고 다시 점점 느려지면서 도착; easing)

좌표가 단 두개인 경우에는 아주 자연스럽지만 경로를 나타내는 라인처럼 수 많은 좌표가 존재하는 경우

각 구간마다 가속도가 붙은 애니메이션을 적용하면 상당히 어색하고,

구간의 길이가 다 다르기 때문에 그에 따라 이동하는 속도도 다르게 되었다.

 

좀 일정한 속도를 갖게 할 순 없나 싶어서 easeTo, flyTo 옵션들을 살펴보고 있는데,

이상하게 어디에도 명시되어 있지 않은 옵션이 있는게 아닌가...

 

문서만 봐선 실제로 해당 옵션이 존재하는 것인지 알 수 없어 코드를 살펴보았다.

그랬더니 코드 내부에서는 당당하게 사용되고 있었고, 옵션에서만 누락이되어 있는 것을 알 수 있었다.

 

특이하게도 js 파일인데 내부에서는 타입스크립트를 사용하고 있었다.

그래서인지 타입 체크가 제대로 되지않는 느낌이 들었다.(제대로 체크가 되었다면 이미 알았겠지...)

 

그래서 잘못 명시된 옵션을 수정해서 PR을 날렸더니 개발자가 올바른 옵션을 알려주었다.

mapbox-gl-js는 그래도 주기적으로 릴리즈가되니 금방 수정 내역을 확인할 수 있을 것 같다.

 

----

 

그 이후.

 

저 옵션을 사용하려고 하다가 문서 오류를 수정하긴 했는데

내가 원하는 기능은 easeTo 옵션만으로 처리가 되지 않아서 결국은 turfjs 를 활용하여 구현하였다.

 

 

 

 

반응형

'Open source' 카테고리의 다른 글

[turf] 누락된 디펜던시 추가 #2345  (0) 2022.10.13
댓글