Облачный атлас

31.05.2025 19:00:01

Важней всего погода в доме. Для всего остального есть векторная карта облаков с использованием heymoon/vector-tile-data-provider:

https://clouds.heymoon.cc

Источник данных

Карта показывает векторный слой с облаками, построенный на основе актуальных спутниковых снимков Европейской организации спутниковой метеорологии.

Используемые технологии:

Сервис агрегирует данные из спутниковых снимков за последние сутки в один векторный слой. Клиент загружает всю историю просматриваемого участка и выводит отфильтрованные данные за выбраный период:

Everything everywhere all at once

Данные обновляются каждый час. Библотека heymoon/vector-tile-data-provider позволяет не только записывать но и читать данные в формате Mapbox Vector Tiles, благодаря чему можно обновить данные без использования промежуточного хранилища.

обновлено 29.11.2025

Режим обоев

Выбранная на карте область фиксируется в адресной строке после якоря и обновляется при каждом перемещении. Вы можете использовать любую область в качестве обоев рабочего стола с помощью HTML Wallpaper в KDE либо аналогов: Wallpaper Добавьте GET-параметр ?wallpaper=1 перед якорем чтобы скрыть ползунок времени и отключить интерактивную навигацию для использования карты с анимацией на заставке. Пример адреса для использования в качестве обоев: wallpaper=1#162.6222;-10.555

Если вы пользуетесь беспроводным интернетом, чтобы обои показывались каждый раз при включении даже если подключение к сети происходит уже после загрузки стола, можно поднять локальный сервер с универсальным сниппетом:

<body style="background-color: black;">
  <script>
    const [healthcheck, redirect] = window.location.hash.slice(1).split('+');
    const checkConnection = (url) => {
      let request = new XMLHttpRequest();
      request.open('GET', healthcheck, true);
      request.onreadystatechange = () => {
        if (request.readyState === 4){
          if (request.status === 200) {
            setTimeout(() => location.replace(url.replace('@', '#')), 1000);
          } else {
            setTimeout(() => checkConnection(url), 1000);
          }
        }
      };
      request.send();
    }
    checkConnection(redirect)
  </script>
  <div style="background-image: url('some-loader.svg');background-repeat: no-repeat;background-position: center;background-color: black;background-size: contain;position: fixed;top: 0;right: 0;left: 0;bottom: 0;margin: 42vh 42vw;"></div>
</body>

Теперь в качестве источника обоев я могу указать адрес вида:

http://127.0.0.1/#https://clouds.heymoon.cc/style+https://clouds.heymoon.cc/?wallpaper=1@132.16369401846373;0.282109199965177;3.9276030513952844;0;0;0

Входные параметры:

  • /clouds?x=0&y=0&z=0 — адрес для проверки доступности
  • /?wallpaper=1@132 — адрес редиректа с заменой символа # на символ @