Как сделать анимацию логотипа?
Что первое, что второе, по описанию, требуют WebGL. Второй вариант проще и легче в плане кода будет: статичная сфера с текстурой + текст, который описывает движение по её орбите.Можно на CSS сделать достаточно убогую бесконечную прокрутку карты, но она не будет учитывать геометрию шара.
Типа так:snippetUPDATE. Увидел такой баг в Android Chrome в результате совместной работы border-radius и overflow:
Нашел решение хаком. Нужно добавить следующее к такому блоку:-webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC); /* this fixes the overflow:hidden in Chrome/Opera */
Это исправило проблему, обновил песочницу.
Карта может быть бесшовной картинкой, а дальше ты просто скроллишь её влево или вправо, внутри круглой "маски" глобуса. Короче круглая маска и под ней бесшовная картинка с материками.
Пример бесконечного скролла картинки: https://amigostone.ru/