feat✨ : signal 상태별로 나타내기 🟢 🔴

[younchong]

Complete

• 중심 위도 경도 기준으로 신호등 8방위에 맞춰서 위치시키기
• 현재 상태에 맞는 색 나타내기

해결했던 문제

• API 데이터가 신호등 위치를 알려주는 위도 경도를 기준으로 8방위에 위치한 신호등 정보를 제공해주는데, 처음에는 중심을 기준으로 px로 움직여서 나타내려고 했다.
• px로 구현할 경우에는 지도를 축소할 경우 완전히 다른 위치에 나타나게 된다.
• 화면 비율이나 다른 방법들을 고민하다가 중심 위도 경도를 기준으로 8방위로 10미터 움직인 위도와 경도를 구해서 표시하는 방법을 택했다.
• 위도와 경도를 기준으로 m만큼 이동한 것을 계산하는데 참고했던 [레퍼런스](* http://www.movable-type.co.uk/scripts/latlong.html) 로 도움을 받았다. + stackoverflow
• 딱 정확하진 않지만 얼추 비슷하게 위치를 나타냈다.

삽질 ⛏

• kakao.maps.LatLng 에서 값이 LA, MA로 반환됐다.
• LA는 latitude, MA는 Longitude라고 생각하고 신호등 위치를 나타냈는데, 계속 나타나지 않았다.
• 디버깅하면서 보니까, lat값이 127, lng값이 34 이렇게 되어있었다.
• 이상하다고 생각하고 수정전의 값이랑 비교해보니까 둘의 위치가 바뀐 것으로 확인했다.
• 그런데 분명히 위 로직에서는 바뀌는 곳이 없는데 왜그런지 찾아봤다.
• LA가 latitude, MA가 Lomgitude를 나타내는 값이 아니었다.
• 공식 문서처럼 kakao.maps.LatLng.getLat(), kakao.maps.LatLng.getLng()로 값을 구해야 안전하고 정확했다.
• 임의로 생각하고 짐작말고, 공식문서 잘읽자...