Custom Dynamic Map Visualization — Google Maps Platform
Динамические карты
Welcome to a whole new level of map customization, interaction, and visualization.
JS
Android
iOS
Экономия времени и ресурсов
Быстрое создание, тестирование и развертывание пользовательских карт.
Более 250 настроек
Create custom detailed maps that truly fit your business.
Более эффективное взаимодействие с пользователем
Новые способы выделить бренд на фоне конкурентов.
Sorry, your browser doesn’t support embedded videos.
Sorry, your browser doesn’t support embedded videos.
Облачные стили карт
Расширенные возможности настройки
Сотни дополнительных тонких настроек под конкретный бизнес или пользователя по сравнению с Google Картами, стилизованными клиентами.
Next generation map visualization
Создавайте трехмерные карты с эффектом присутствия с помощью таких функций, как режим наложения в WebGL, наклон и вращение.
Обновление на всех платформах без написания кода
Одновременное развертывание обновлений на всех платформах без единой строчки кода для согласованного взаимодействия с пользователями.
Входит в Maps JavaScript API, доступно для Android SDK и iOS SDK.
Easily create custom interactive markers
Make markers your own
Change the color, background, icon, and outline of the Google Maps red pin, and create custom markers with SVGs, PNGs or HTML elements. Do it all directly in your code, with no image needed.
Improved marker performance
Advanced Markers can load up to 66% faster than our traditional markers, and provide faster panning and zooming,1 while supporting fast load times for a larger amount of markers.
Marker Collision Management
Choose which markers are displayed at each zoom level, and control how your markers interact with each other.
Построение границ с помощью стилей на основе данных
Более эффективное отображение данных с помощью многоугольников
Показывайте административные границы на основе коммерческих данных, используя многоугольники Google с требуемым стилем.
Подробные данные о границах, предоставляемые Google
Используйте такие же многоугольники, как в Google Картах. Получите доступ к данным об административных районах, включая страны, населенные пункты, почтовые индексы и др.
Экономия ресурсов разработчиков
Экономьте время и ресурсы разработчиков, разрешив Google проверять и обновлять данные о границах, а также управлять ими за вас.
Расширенная настройка
Фильтрация объектов коммерческой инфраструктуры
Определяйте, какие организации показывать на вашей карте, с учетом их релевантности для ваших клиентов.
Управление плотностью размещения объектов инфраструктуры
Корректируйте число объектов инфраструктуры на карте, чтобы показать дополнительную информацию или сделать карту более четкой.
Sorry, your browser doesn’t support embedded videos.
Стили для коммерческих коридоров
Изменяйте цвет коммерческих коридоров для дополнительной визуализации.
Детализированные карты улиц
Make maps more detailed with sidewalks, crosswalks, traffic lights, and more.
Значки для ориентиров
Обозначайте и выделяйте туристические достопримечательности в 100 городах по всему миру, чтобы упростить поиск важных ориентиров.
Улучшенные природные объекты
Повышайте удобство использования, применяя стили для ранее недоступных элементов карты, таких как леса и пустыни.
Отраслевые стили карт
Используйте в качестве основы предварительно настроенные карты, оптимизированные для отраслей туризма, недвижимости, розничной торговли и логистики.
Advanced Markers
Easily create highly customized, faster performance markers that provide a richer user experience and showcase your brand.
Data-driven Styling
Display and style Google’s polygons for administrative boundaries, or join your own business data to create customized choropleth maps.
Powerful map visualizations
Режим наложения в WebGL для JavaScript
Визуализируйте 2D и 3D-объекты с панорамой прямо на базовой карте.
Sorry, your browser doesn’t support embedded videos.
Векторные карты
Ускоренная загрузка, более плавное масштабирование и панорамирование и эффективное кэширование карт. Также поддерживается управление наложением маркеров.
Наклон и вращение
Возможность рассматривать и изучать карту под разными углами.
Sorry, your browser doesn’t support embedded videos.
Other Dynamic Maps features
Типы карт
Доступны дорожные, спутниковые, гибридные и пользовательские карты, а также карты рельефа.
Sorry, your browser doesn’t support embedded videos.
Фигуры
С помощью встроенных функций, включая ломаные линии и многоугольники, на карте можно рисовать различные фигуры.
Маркеры
Используйте маркер Google Карт по умолчанию или добавляйте собственные пользовательские маркеры.
Возможности использования
Помощь в поиске нужных мест
Будь то обычный магазин, банкомат, передвижная закусочная или просто место для парковки – облачные стили карт помогут упростить поиск нужных клиенту объектов.
Объекты рядом с компанией
Покажите клиентам объекты и заведения рядом с вашей компанией, которые могут их заинтересовать, например аптеки, зарядные станции или кофейни.
Обзор окрестностей
Облачные стили карт с настраиваемыми объектами инфраструктуры и 3D-визуализациями позволяют легко продемонстрировать пользователям, что находится в окрестностях дома, квартиры или отеля.
Новые возможности взаимодействия с клиентами
Создавайте на картах специальные интерактивные элементы для акции или мероприятия, соответствующие особенностям вашего бренда.
Explore demos with Dynamic Maps
Make customized map markers
Experience creating your own Advanced Markers. In this demo you can customize the iconic Google Maps red pin, create custom markers from images, and programmatically customize your own markers.
ПосмотретьПосмотреть
Настройте стиль границ Google с использованием ваших коммерческих данных или без них
Простой доступ, показ и настройка стиля многоугольников Google для административных границ с возможностью добавления собственных коммерческих данных в табличной форме для создания пользовательских картограмм.
ПосмотретьПосмотреть
Протестируйте возможности облачных стилей карт
Испытайте сами, как быстро можно создавать карты с высокой степенью настройки без написания кода.
ПосмотретьПосмотреть
Создайте трехмерную карту с эффектом присутствия с помощью WebGL
Узнайте, как функции карты на базе WebGL для Maps JavaScript API обеспечивают беспрецедентные возможности управления векторной базовой картой.
ПосмотретьПосмотреть
Путешествуйте по миру на интерактивной карте на базе WebGL
Посмотрите, как может измениться мир благодаря возможностям управления и визуализации на карте в трех измерениях.
ПосмотретьПосмотреть
Узнайте, как создавать цифровые версии городов с помощью WebGL с функциями 3D
Компания UbiLabs создала цифровую демоверсию Гамбурга, чтобы показать, как можно использовать цифровые версии для анализа и проверки сценариев, прежде чем тестировать их в реальном мире.
ПосмотретьПосмотреть
Начните разработку с использованием динамических карт
JS Android iOS
НачатьНачать
Найдите подходящие продукты для вашего проекта
Все продукты
Начните использовать платформу Google Карт
Начать
Гугл Карты не работают сегодня февраль 2023
Сбой сервиса Гугл Карты 02. 02.2023г.
Сегодня 2 февраля 2023 наблюдаются перебои в работе приложения Гугл Карты и веб-версии сайта google.com/maps.
Почему не работают Гугл Карты? Что за сбой 2 февраля?
На большей части России сегодня 2 февраль 2023 не работает приложение Google Maps. Сбои зарегистрированы в следующих регионах страны:
Республика Башкортостан (г. Уфа) | Ярославская область (г. Ярославль) |
Кабардино-Балкарская Республика (г. Нальчик) | Калининградская область (г. Калининград) |
Республика Мордовия (г. Саранск) | Саратовская область (г. Саратов) |
Архангельская область (г. Архангельск) | Амурская область (г. Благовещенск) |
Томская область (г. Томск) | Ямало-Ненецкий автономный округ (г. Салехард) |
Курская область (г. Курск) | Ростовская область (г. Ростов-на-Дону) |
Республика Бурятия (г. Улан-Удэ) | Ненецкий автономный округ (г.![]() |
Брянская область (г. Брянск) | Республика Ингушетия (г. Магас) |
Чукотский автономный округ (г. Анадырь) | Пензенская область (г. Пенза) |
Оренбургская область (г. Оренбург) | Калужская область (г. Калуга) |
Ханты-Мансийский автономный округ — Югра (г. Ханты-Мансийск) | Приморский край (г. Владивосток) |
Курганская область (г. Курган) | Республика Карелия (г. Петрозаводск) |
Республика Коми (г. Сыктывкар) | Псковская область (г. Псков) |
Владимирская область (г. Владимир) | Карачаево-Черкесская Республика (г. Черкесск) |
Ивановская область (г. Иваново) | Иркутская область (г. Иркутск) |
Смоленская область (г. Смоленск) | Республика Тыва (г. Кызыл) |
Республика Саха — Якутия (г. Якутск) | Республика Крым (г. Симферополь) |
Кировская область (г. Киров) | Республика Северная Осетия — Алания (г.![]() |
Забайкальский край (г. Чита) | Тюменская область (г. Тюмень) |
Хабаровский край (г. Хабаровск) | Республика Алтай (г. Горно-Алтайск) |
Ульяновская область (г. Ульяновск) | Республика Татарстан (г. Казань) |
Республика Калмыкия (г. Элиста) | Свердловская область (г. Екатеринбург) |
Красноярский край (г. Красноярск) | Ленинградская область (г. Санкт-Петербург) |
Почему не работает Гугл Карты? Что за сбой 2 февраля?
По вопросам сбоя в работе приложения на Android или iOS вы можете обратиться по телефону горячей линии google.com/maps:
+7 (495) 644-14-00,
Или в ближайшее отделение Гугл Карт:
Оцените статью:
Загрузка…
Поделитесь информацией о сбое в соцсетях
Размещение маркеров на 3D-карте Google
С мая 2021 года разработчики теперь могут отображать 2D- и 3D-объекты на карте Google, позволяя пользователям наклонять и панорамировать для разных точек зрения.
Я нашел способ обойти это, и я покажу вам решение в шагах ниже с предоставленным кодом.
Как добавить несколько маркеров на 3D-карту Google
В коде учебника карта инициализируется широтой и долготой с уровнем масштабирования.
Когда маркер загружается, он масштабируется и поворачивается, но нет привязки к широте и долготе того места, где он должен быть размещен.
Это связано с тем, что 3D-карта рассматривается как «пространство», а не как карта в традиционном смысле.
Теперь я расскажу вам, как мне удалось добиться этого всего за несколько коротких шагов, чтобы вы тоже могли создавать маркеры на своей 3D-карте.
Как разместить маркеры на 3D-карте
Изучив исходный код приведенного выше примера из браузера, мы можем заглянуть за кулисы, чтобы увидеть, как Google достигает этого.
После поиска в коде метод createMarkers кажется отличным местом для начала:
‘
Marker3d() — это функция, которая принимает имя объекта и создает 3D-модель на лету. На приведенном выше снимке экрана карты текст будет, например, «Горнодобывающий район» или «Площадь Ганди».
Используя пример Google, мы установим точку останова и посмотрим, что получится в результате передачи функции Mining District для переменной «point» с координатами -26.2066872, 28.0366495.
Функция latLngToMetersRelative() принимает два объекта с разными значениями широты и долготы и возвращает расстояние между ними в метрах для направлений x и y. Переменная point — это координаты Mining District, а как насчет sceneAnchor? Нажатие точки останова на этом в коде показывает, что значение равно {altitude: 0, lat: -26.20227, lng: 28.04363}. Как вы уже догадались, это совпадает с центром карты во время инициализации.
Итак, в соответствии с идеей, что это трехмерное пространство, а не карта, все маркеры размещены относительно центра и смещены по осям x и y на количество метров. Код для расчета этого расстояния приведен ниже, где Distance() импортируется из библиотеки Turf.
Последняя часть головоломки состоит в том, чтобы увидеть, как они добавляются в трехмерное пространство, которое находится чуть ниже того места, где была вызвана функция createMarkers():
Этот пример карты содержит некоторые полезные функции, которые разработчики могут захотеть включить, особенно при включении текста в 3D-модели, используемые в качестве маркеров. Когда пользователь увеличивает и уменьшает масштаб, маркер масштабируется, чтобы шрифт был соответствующего размера:
.
Еще одна замечательная особенность заключается в том, что маркеры поворачиваются лицом к пользователю при панорамировании камеры:
Эти функции не являются стандартными из коробки, однако исходный код ссылается на функции для выполнения этих движений:
Сочетание стиля карты и 3D-карт Можно также комбинировать стиль карты с 3D-картами. Это отлично подходит для согласования цветовой схемы веб-сайта или брендинга со встроенной картой. Я сделал один сам, который вы можете посмотреть ниже!
Здесь вы можете взаимодействовать с картой. При передаче идентификатора карты используйте тот, к которому был применен стиль на странице управления картами в консоли GCP.
Что дальше?
После прохождения руководства и последующего просмотра исходного кода в поисках более сложного примера кажется, что будущее 3D-карт Google уже готово, но это не упаковано в пакет, который может принести пользу разработчикам в широкий диапазон уровней мастерства… пока.
После разговора с инженером по работе с клиентами Google это кажется ступенькой к гораздо более широкой картине, поскольку этот выпуск разблокирует будущие необъявленные функции. Я предполагаю, что опыт разработчиков будет более зрелым, чтобы соответствовать хорошо известному Maps Javascript API. Надеюсь, вы сможете предоставить список маркеров со структурой объекта, подобной приведенному ниже фрагменту.
Я бы также предсказал полную библиотеку 3D-маркеров, возможно, с возможностью передачи текста для меток. На данный момент всего этого можно добиться, написав код самостоятельно.
На этом раннем этапе выпуска функции Google, кажется, немного не уверен в том, как представить варианты использования, и многие примеры вращаются вокруг идеи «разве это не выглядит круто». На мой взгляд, вид карты с высоты птичьего полета наиболее полезен при планировании автомобильного маршрута на большое расстояние.
Где 2D-карта может вызвать проблемы при попытке определить направление от того, что находится на вашем телефоне, к тому, что находится перед вами; 3D-карта может позволить вам ориентироваться на размер и форму окружающих зданий, чтобы понять, где вы сейчас находитесь. Имея это в виду, возможно, фестивальное приложение могло бы извлечь из этого пользу. Представьте, что вы смотрите на свой телефон на здания вокруг вас, на змею, обвивающую небоскреб, или на здание, пульсирующее всеми цветами радуги, чтобы выделить пункт назначения. Пользовательский опыт может быть потрясающим на телефоне!
Google поверхностно обрисовал эту идею на своей демонстрационной странице, на которую стоит взглянуть, чтобы подстегнуть идеи.
Если вам нужна дополнительная информация…
Если вы хотите узнать больше о платформе Google Карт или вам нужна помощь в создании собственной 3D-карты, свяжитесь со мной в Liveli. Мы всегда готовы поболтать.
Назад к новостям
Как Google создает безумно детализированные трехмерные миры из фотографий
2 комментария Вы когда-нибудь задумывались, как Google удается отображать все, от кустов и валунов до ферм мостов и небоскребов, с удивительной трехмерной детализацией? В этой статье мы узнаем, как это сделать. Он включает в себя высокотехнологичную газонокосилку, большие вычислительные мощности и тысячи терабайт данных.
Извините, сколько данных?
Как Google Планета Земля, так и Карты Google включают базовые двухмерные изображения с момента их первого запуска в 2005 году. Эти фотографии сверху вниз почти всегда поступают со спутников. За последние 15 лет наше взаимодействие с этой потрясающей перспективой Земли стало настолько обыденным, что может показаться не таким уж впечатляющим. Мы привыкли к возможности масштабирования до метрового разрешения практически в любой точке планеты с наших телефонов.
Тем не менее, то, что происходит под капотом и сам размер задействованных чисел, поражает. Даже далекий «красивый вид» Земли, который мы видим при максимальном увеличении, сшит из чего-то вроде 700 000 отдельных изображений Landsat общим размером около 800 миллиардов пикселей (посмотрите это отличное видеообзор). И это при самом низком уровне масштабирования.
Помимо этого, имеется 20 дополнительных уровней масштабирования, позволяющих захватывать постоянно растущие уровни детализации по всему миру. При максимальном увеличении полная картина Земли составляет более 500 миллионов пикселей по бокам и, даже в сжатом виде, соответствует более 25 000 терабайтам данных (и вы думали, что у Sony A7R IV крошечные 61MP, 9Разрешение 504 x 6336 было впечатляющим). И это только для одного уровня масштабирования. Это «большие данные».
Кроме того, они стараются обновлять изображения для крупных городов чаще, чем раз в год, а для других районов — каждые пару лет. Это поддерживает актуальность изображений и сохраняет интерактивную историческую запись того, как Земля меняется с течением времени. Конечным результатом является то, что они снова добавляют столько же данных в репозиторий каждый год или два.
Создание фантастических трехмерных миров
В последние годы вы, возможно, сталкивались с областями, где доступны гораздо более подробные трехмерные данные и изображения. Карту этих улучшенных областей можно найти здесь.
Вид сверху на внутренний двор в «пригороде» Гонконга.
Я лично потерял несколько часов, исследуя эти виртуальные миры, не выходя из своего домашнего офиса. В конце концов, вы начинаете задаваться вопросом, как они это делают. Как они создают такие детализированные 3D-модели, вплоть до отдельных вентиляционных отверстий для кондиционеров и садовых стульев на крышах небоскребов, которые, должно быть, составляют тысячи небоскребов только в Гонконге? Оказывается, все это делается по фотографиям и точно повторяет то, как наш собственный мозг извлекает трехмерную информацию об окружающем нас мире из нашего стереоскопического зрения. Таким образом, не только текстуры берутся из изображений, но и трехмерная структура сцены также извлекается из изображений .
Процесс начинается с полета. На самом деле их целая куча. Самолет взлетает на несколько часов и летит по схеме, очень похожей на стрижку газона, вниз и назад, вниз и назад. На самолете установлено пять разных камер, которые делают снимки спереди, сбоку, сзади и снизу на протяжении всего полета, причем каждое изображение привязано к точному местоположению GPS и углу камеры.
Таким образом, первым шагом является обработка изображений с помощью ряда алгоритмов обработки для удаления дымки, выполнения базовой цветокоррекции и удаления (большинства) автомобилей и других временных объектов. Но как на самом деле превратить кучу снимков, сделанных в разных местах и под разными углами, в трехмерное представление мира? Давайте взглянем.
Следующим шагом является определение связанных функций на каждом из перекрывающихся изображений. В качестве примера предположим, что мы сфотографировали городскую среду с трех разных точек зрения. Расположение камер показано в левом нижнем углу рисунка ниже тремя цветными кружками.
Места, из которых были взяты три разных изображения одной и той же сцены.В качестве интересных объектов выделим две точки на внутренних краях ближайших небоскребов, а также фонтан во дворе более дальнего здания. Три точки отмечены перекрестием на изображении ниже, снятом с синей камеры.
Расположение трех объектов в поле зрения центральной камеры вместе с лучами, прочерченными из положения камеры в направлении каждого объекта (врезка).
На врезке в верхнем левом углу показано положение камеры и эффективное поле зрения изображения, а также лучи, исходящие из положения камеры через плоскость изображения и направленные к идентифицированным нами элементам (изображение плоскость обозначена поверхностью маленького затемненного треугольника в начале камеры). Мы знаем, что объекты, отмеченные перекрестием, должны лежать вдоль этих лучей, но поскольку у нас есть только 2D-изображение, мы не знаем, как далеко от камеры расположены эти объекты. Технически они могут лежать где угодно вдоль соответствующего луча.
То же упражнение можно повторить для двух других положений камеры, одно будет снято немного левее первого (обозначено зеленым ниже), а другое — немного правее (обозначено желтым). Одни и те же особенности можно идентифицировать на каждом из изображений и лучей, прослеживаемых от положения камеры в соответствующем направлении каждого из них. Используйте ползунок, чтобы увидеть, как различаются виды и световые пути.
Обратите внимание, что извлечение признаков и сопоставление изображений не является тривиальной задачей. Это упрощается, если два изображения взяты из относительно схожих положений, поскольку расположение функции на одном изображении дает преимущество в том, где искать эту функцию на другом. Также может помочь тот факт, что положения многих признаков коррелированы и имеют тенденцию перемещаться вместе от одного изображения к другому. Тем не менее, есть места, где функция может быть закрыта на одном изображении, а не на другом, что может вызвать проблемы (мы просто не находим ее или ее действительно нет?). Наш мозг эволюционировал, чтобы очень хорошо справляться с этой задачей определения визуальных особенностей в пределах нашего поля зрения и сопоставления их между различными сигналами, получаемыми левым и правым глазами. Это одна из самых фундаментальных целей нашей зрительной системы. Но разработка компьютерных алгоритмов для дублирования даже рудиментарной версии этой возможности не является тривиальной.
Следующим шагом является использование трехмерных лучей, вычисленных в предыдущем разделе, для определения положения каждого объекта в трехмерном пространстве. В принципе, для вычисления местоположения точки в трех измерениях необходимы только два луча, поскольку пересечение двух лучей должно указывать местоположение объекта. На самом деле, часто бывает так, что два луча вообще не пересекаются в трех измерениях из-за погрешности измерения или ошибки. Вместо этого точка ближайшего подхода на каждом луче может использоваться для вычисления вероятного местоположения объекта. Использование более двух лучей и использование лучей, рассчитанных из значительно разных местоположений, может помочь уменьшить ожидаемую ошибку в вычисляемых местоположениях объектов.
Три луча, соответствующие объекту на краю левого небоскреба, показаны на паре изображений ниже (левая панель) вместе с предполагаемым местоположением объекта (правая панель).
Путем сопоставления лучей от трех изображений, соответствующих каждому объекту, можно также оценить расположение других элементов сцены.
Позволяет определить расположение отдельных элементов. Но как же тогда воссоздать целые здания, деревья или скальные образования?
Картирование глубины и генерация сетки
Первое, что нам нужно сделать, это извлечь позиции большего количества объектов. Гораздо больше возможностей. Мы будем использовать только небольшое число в иллюстративных целях, но на самом деле, скорее всего, будет использоваться почти каждый пиксель. Давайте определим расположение некоторых особенностей на нескольких зданиях, а также на некоторых близлежащих деревьях (левая панель на рисунке ниже).
Давайте затем пройдем описанный выше процесс и используем три отдельных изображения для извлечения трехмерных позиций для каждой из идентифицированных функций (правая панель вверху). Результат на самом деле немного обескураживает. Это не что иное, как набор независимых точек в трехмерном пространстве. Не то, на что мы могли надеяться.
Чтобы действительно начать извлекать структурные особенности зданий и растительности из этих точек, необходим еще один шаг. Свободные наборы независимых точек должны быть объединены в поверхности путем их встраивания в сетку. Ребра сетки определяют отношения между отдельными точками на поверхности (левая панель рисунка ниже). Может быть невероятная неопределенность в отношении того, как связаны разные точки на поверхности и какие точки в трехмерном пространстве на самом деле принадлежат одной и той же поверхности. Существуют целые программные пакеты, которые ничего не делают, кроме помощи в определении поверхностных сеток из наборов 3D-точек.
Как только эти поверхности будут построены, начнется настоящее веселье. Теперь мы можем вернуться к исходному изображению и использовать его, чтобы применить текстуру к поверхности. По сути, мы можем накладывать изображения, которые мы собрали, на соответствующие трехмерные структуры с дополнительным преимуществом, заключающимся в том, что у нас есть несколько изображений каждой точки на каждой поверхности на выбор. Если есть зеркальный блик или отражение с одной точки обзора, цвет можно извлечь из другого изображения, которое более точно отражает фактический цвет поверхности.
Основные методы, описанные здесь, используются во многих областях помимо создания виртуальных воспроизведений отдаленных уголков земли. Для некоторых из моих постдокторских исследований мы использовали подход для отслеживания взаимодействующих частиц в трехмерных турбулентных потоках жидкости по видео, снятым с частотой 1000 кадров в секунду. Средства массовой информации использовали эту технику для расчета трехмерного положения теннисного мяча во время матчей и получения интересных повторов. И футбол (извините… футбол ) болельщики в Европе теперь могут выйти на поле и смотреть повторы игр в 3D с любого ракурса. Однако я не большой фанат футбола, поэтому я буду продолжать исследовать сумасшедшие скальные образования юго-западной пустыни из своего офиса, пока пандемия не утихнет и мы не сможем вернуться по-настоящему.