Я использую функцию из mourner / suncalc , которая позволяет мне получить текущую позицию нашего солнца.С помощью getPosition()
я хочу создать анимацию на изображении или с использованием чистого CSS (конечно, масштабируемого до различных разрешений экрана и ориентаций), где вы можете видеть, где сейчас находится солнце, в режиме реального времени на странице.Совершенно ненужная функция, но забавная функция :) На изображении ниже показано, как я думаю.
![enter image description here](https://i.stack.imgur.com/Wv51a.jpg)
Как я уже сказал, я буду использоватьgetPosition()
функция от функции скорбящего, которая печатает азимут и высоту солнца.Проблема, с которой я сейчас сталкиваюсь, заключается в том, чтобы каким-то образом преобразовать эти данные в проценты или пиксели, чтобы солнце на моем примере изображения выше двигалось вдоль круглой линии (и да, солнце должно быть заблокировано прямой линией, имитирующей землю),имитируя реальное положение на небе в реальной жизни.
Данные по азимуту выглядят как -0.7000179547193575, а высота над уровнем моря выглядит так: -0.699671080144066 (в зависимости от текущего положения солнца, где я сейчас нахожусь).
Как мне это сделать?Могу ли я сделать это с помощью чистого CSS или я должен сделать это с изображениями?