핵심 기능은 다 구현이 되었기 때문에, 부가적인 요소를 생각해봅시다.
여러가지 함수를 테스트해봤지만 1차식을 사용했을 때 가장 그럴싸한 결과가 나오는 것을 확인할 수 있었습니다.
5등급정도의 별이 1px정도의 크기를 가지고, 0등급정도의 별이 7px정도의 크기를 가지게 만들어줍시다. 절대적인 공식은 없고, 보기에 적절하게 조절된 것 같을때가지 변수를 조절해주면 됩니다.
1 | // brightness : mag -> size |
이번 챕터에서는 브라우저에서 사용될 코드를 작성합니다.
단순한 플라네타리움의 구현이 목표이기 때문에, 프론트(HTML, CSS, JS) 코드는 최소한으로 간단하게만 구성합니다.
이번 챕터에서 프론트에서 구현해야 하는 로직은 다음과 같습니다.
<star>라는 태그이름을 쓰겠습니다) 생성window에 element 배치참고로, 별마다 HTML element를 생성한다면 성능에 큰 문제가 있을 가능성이 높습니다. 하지만 제대로 표현되는 것을 확인하는데에는 문제가 없으니 이대로 진행한 후 성능개선이 필요한 경우 해당 부분을 교체하면 됩니다.