Дневная / Ночная Карта мира

Кол-во просмотров: 1

Пример работы: http://орлин.рф/utils/day-night/?lat=53.1958&lon=50.1002&hour24&showloc

Исходники(русский) скачать:

Визуализация дневных и ночных регионов мира в режиме реального времени с использованием точных расчетов положения Солнца и Луны.

Характеристики

Линия разграничения дня и ночи в реальном времени на основе текущего времени UTC
Плавные градиенты сумерек, показывающие зоны рассвета и заката, благодаря профессиональной интеграции SunCalc
Индикатор положения солнца, показывающий, где солнце находится прямо над головой
Индикатор положения Луны, показывающий, где луна находится прямо над головой, с изменяемым размером в зависимости от расстояния
Точная визуализация фазы Луны, показывающая текущую освещенность с использованием расчетов SunCalc
Отображение названия фазы Луны и процента освещенности
Адаптивный дизайн с обычным и минимальным режимами просмотра
информационная панель с 3 столбцами, показывающая дату, время восхода / захода солнца и фазу Луны
Расширенные астрономические данные, включая солнечный полдень, время золотого часа и время восхода / захода Луны
Определение местоположения с помощью параметров URL или HTML5 Geolocation API
Дополнительный маркер местоположения, показывающий точку расчета на карте
Режим в оттенках серого, оптимизированный для дисплеев e-ink с плавными градиентными переходами
Поддержка двойной проекции: равноугольной (по умолчанию) и проекции Меркатора
Точное отображение координат с возможностью выбора типов проекций для соответствия различным форматам карт мира.

Использование

Обычный режим: откройте lanrat.github.io/day-night-map/ в веб-браузере
Минимальный режим: откройте lanrat.github.io/day-night-map/?minimal, чтобы увидеть карту на весь экран с информационной панелью внизу
Режим отображения в оттенках серого: добавьте &grayscale к любому URL-адресу для оптимизации отображения на дисплеях с поддержкой оттенков серого или электронных чернил (например, ?minimal&grayscale)
Режим отображения со статической временной меткой: добавьте &timestamp=<unix_timestamp>, чтобы отобразить карту на момент определенного времени, а не текущего

Параметры URL-адреса

Все параметры можно комбинировать и использовать как в формате строки запроса (?), так и в формате хэша (#):

minimal — Минимальный просмотр в полноэкранном режиме
grayscale — Оптимизирован для отображения в оттенках серого / e-ink
timestamp=<value> — Отображение карты в определенное время (временная метка Unix в секундах или миллисекундах)
timezone=<value> — Отображение даты / времени в указанном часовом поясе (название часового пояса IANA, по умолчанию используется местный часовой пояс пользователя)
lat=<value> — Широта пользователя для астрономических расчетов на основе местоположения (от -90 до 90)
lon=<value> — Пользовательская долгота для астрономических расчетов на основе местоположения (от -180 до 180)
showloc — Отображение точки-маркера местоположения в указанных широтах на карте
nosun — Скройте маркер положения солнца как на карте, так и в легенде
nomoon — Скройте маркер положения Луны как на карте, так и в легенде
projection=<value> — Тип проекции карты: equirectangular (по умолчанию соответствует большинству SVG-файлов карт мира) или mercator (проекция веб-меркатора)
hour24 — Отображение всего времени в 24-часовом формате вместо 12-часового формата AM / PM

Примеры:

?minimal&grayscale — Режим с минимальными оттенками серого
?timestamp=1672531200 — Новый 2023 год в полночь по UTC
?timezone=America/New_York — Отображение времени в Восточном часовом поясе
?timezone=Asia/Tokyo&minimal — Токийское время в минимальном режиме
#minimal&timestamp=1672531200000 — Минимальный режим в определенное время (миллисекунды)
?minimal&grayscale&timestamp=1640995200&timezone=Europe/London — Все параметры объединены
?hour24 — Отображение всего времени в 24-часовом формате
?hour24&timezone=Europe/Berlin — 24-часовой формат с часовым поясом Берлина
?lat=40.7128&lon=-74.0060 — Местоположение Нью-Йорка для расчета восхода / захода солнца
?lat=51.5074&lon=-0.1278&timezone=Europe/London — Координаты Лондона с местным часовым поясом
?lat=35.6762&lon=139.6503&hour24&timezone=Asia/Tokyo — Местоположение Токио в 24-часовом формате
?lat=37.7749&lon=-122.4194&showloc — Сан-Франциско с указанием местоположения точкой
?lat=35.6762&lon=139.6503&showloc&grayscale — Токио с указанием местоположения в режиме оттенков серого
?nosun — Карта дня / ночи без обозначения солнца (минимальное отображение)
?nomoon — Карта дня / ночи без маркера Луны
?nosun&nomoon — Чистая карта дня / ночи без маркеров небесных тел
?minimal&grayscale&nosun&nomoon — Отображение в ультрамалых оттенках серого только с областями дня / ночи
?projection=mercator — Используйте проекцию Меркатора вместо равноугольной
?lat=40.7589&lon=-73.9851&showloc&projection=mercator&minimal — Таймс -сквер с проекцией Меркатора в минимальном режиме

Технические детали

Приложение использует профессиональную библиотеку SunCalc для точных астрономических расчетов в сочетании с пользовательскими алгоритмами определения положения небесных тел. Положение Солнца и Луны рассчитывается с помощью гибридных подходов, которые используют SunCalc для сложных вычислений, но при этом сохраняют эффективность пользовательского кода для определения положения точек вблизи Солнца и Луны.

Особенности интеграции SunCalc

Солнечные расчеты: время восхода/захода солнца, солнечный полдень, периоды «золотого часа» и углы возвышения Солнца
Лунные расчеты: фаза Луны, доля освещенной поверхности, время восхода/захода Луны и расстояние до Луны для изменения размера
Поддержка геолокации: автоматическое определение геолокации или ввод координат вручную с помощью параметров URL
Учет часовых поясов: отображение времени в любом часовом поясе IANA с возможностью переключения на местный часовой пояс пользователя

Система Рендеринга

Для визуализации смены дня и ночи используется HTML5 Canvas с оптимизированным рендерингом на уровне пикселей:

Градиенты сумерек: Плавные переходы через астрономические, морские и гражданские сумеречные зоны.
Оптимизация оттенков серого: рендеринг, удобный для использования электронными чернилами, с плавными градиентами (а не только дискретными зонами с тремя оттенками)
Переменный размер Луны: размер Луны изменяется в зависимости от фактического расстояния между Землей и Луной (перигей и апогей)
Перенос краев: Небесные тела обтекают края карты для непрерывного просмотра мира.
Маркеры местоположения: Необязательная красная точка местоположения (черная в оттенках серого) с белой рамкой для обозначения расчетных координат.
Динамическая легенда: маркер местоположения автоматически появляется в легенде при использовании showloc параметра

Картографические проекции

Приложение поддерживает две системы координат:

Экваториальная проекция (по умолчанию): простое линейное отображение широты и долготы, которое соответствует большинству SVG-файлов и изображений с картами мира
Проекция Меркатора: веб-проекция Меркатора, обычно используемая в веб-картографии
Автоматическое определение: по умолчанию используется экваториальная проекция, соответствующая включенному в комплект SVG-файлу с картой мира, но ее можно изменить с помощью параметра URL

Информационная Панель

На информационной панели с тремя столбцами отображается:

Столбец «Дата»: текущая дата с расчетом продолжительности светового дня
Столбец «Солнце»: время восхода/захода солнца со стрелками вверх/вниз, а также время солнечного полдня и «золотого часа»
Столбец «Луна»: текущий символ и название фазы с указанием процента освещенности, а также время восхода/захода луны

Для расчетов с учетом местоположения требуются либо параметры URL (lat= и lon=), либо разрешение на геолокацию в браузере. Без данных о местоположении время восхода/захода солнца и восхода/захода луны отображается как «неизвестно».

Карта обновляется каждую минуту в соответствии с текущими условиями. При использовании параметра timestamp карта отображает статичный снимок на определенный момент времени и не обновляется автоматически.

Вдохновлено картой мира с указанием времени и даты

day-night-map-main-rus Скачать

Источник: https://github.com/lanrat/day-night-map/tree/main