Как интегрировать яндекс карты в приложение
В случае с Apple CarPlay интерфейс приложения будет очень похожим на тот, что используется в собственной оболочке Яндекса для автомобильных мультимедийных систем — Яндекс.Авто. И если вы пользовались каршерингом в Москве или ездили на самых актуальных Ладах, то, скорее всего, знаете, как он выглядит.
У Android Auto (ролик ниже) немного другие иконки, чуть иная организация меню, но разобраться совсем не сложно.
И что, всё работает точно так же, как на смартфоне?
Не совсем — потому что у автомобильных платформ есть ряд собственных ограничений. Именно поэтому в Яндекс.Картах на CarPlay и Android Auto, например, нет встроенного голосового помощника Алиса, а для ввода адреса используются системы распознавания голоса, созданные Apple и Google. Но и они с приложением Яндекса работают отменно.
Система безукоризненно считывает адрес вне зависимости от того, с какой скоростью и громкостью вы его озвучили. За несколько дней интенсивного использования осечек не было. А ввод с клавиатуры, который в бета-версии работал через раз, к релизу полностью починили.
К сожалению, ни на одной из двух платформ нельзя менять масштаб карты сводя или разводя пальцы (pinch to zoom), а в Android Auto нельзя ещё и панорамировать карты, хотя в CarPlay такая функция есть. Но это тоже ограничение со стороны платформы, а не Яндекс.Карт.
Ещё одна фишка, от которой пришлось отказаться разработчикам, — нативная поддержка Яндекс.Заправок прямо на экране мультимедийки. То есть подъехать на АЗС и с экрана мультимедийной системы своей машины выбрать и оплатить нужное количество топлива не получится, так как CarPlay и Android Auto не поддерживают транзакционные сервисы.
Однако пользоваться Я.Заправками по-прежнему можно. Для этого надо нажать на экране смартфона кнопку «Продолжить в телефоне», совершить привычные операции, а затем вернуть отображение карт на экран в машине. Маршрут при этом не собьётся и не потеряется — мы проверяли.
Больше того: если случайно отключить кабель от мобильного устройства, то ведение по маршруту продолжится в телефоне, а при повторном подключении маршрут вернётся на экран мультимедийной системы.
Что можно настраивать?
В приложении для автомобильной мультимедийки есть только базовые настройки — можно включить или выключить отображение слоя с пробками на картах, выбрать, какие оповещения должна озвучивать система на маршруте (или вообще их выключить), а также задать громкость этих самых оповещений.
То, чего многие автовладельцы ждали не один год, произошло в августе 2021 года, «Яндекс», как и обещала этой весной, добавила в «Яндекс.Навигатор» и «Яндекс.Карты» поддержку Android Auto и Apple CarPlay. Российский гигант очень долго сопротивлялся и не делал интеграции своей навигации в чужие автомобильные платформы. Видимо, считая себя отечественной Google, что отчасти правда, компания всеми силами пыталась создать собственный Android Auto.
Тест LADA XRAY Cross. Основной инстинкт
Сегодня у нас на тесте LADA XRAY Cross, но не обычная, а в исполнении Instinct, с некоторыми отличиями по оформлению и, главное, с вариатором и встроенной системой «Яндекс.Авто».
А также в Mitsubishi:
Тест Mitsubishi Outlander III. Теперь с «Яндекс.Авто»
Мы уже рассказывали вам про японский кроссовер Mitsubishi Outlander III, сегодня же речь пойдёт про его версию с предустановленным головным устройством от «Яндекса», которое впервые получило доступ к системе автомобиля.
Тест Nissan Qashqai. Сбалансированный кроссовер?
Nissan Qashqai - лидер по продажам марки в России за 2019 год. В прошлом году Nissan удалось реализовать 25 158 автомобилей данной модели, что, по данным «АВТОСТАТ», позволило Qashqai войти в ТОП-25 самых продаваемых моделей.
Но, видимо, бизнес с головными устройствами у «Яндекса» особо не пошел, автопроизводители не очень любят, когда в их автомобили устанавливают сторонние решения. Да и обычные пользователи предпочитают брать «головы» на ОС Android с Aliexpress, так как они стоят дешевле, по железу интереснее, да и имеют больше возможностей, так как не ограничены софтом «Яндекса». К тому же российской компании не давали покоя лавры Google, так что отечественная корпорация решила выпустить свой Android Auto, назвав его «Яндекс.Авто».
Реальность и перспективы рынка IT‑профессий
Какие профессии наиболее популярны и высокооплачиваемы?
Субботний кофе №181
Налейте чашку бодрящего субботнего кофе и познакомьтесь с новостями недели. Роскомнадзор выставил новые требования западным компаниям, Apple запустила SharePlay, Sony открыла предзаказ на Xperia PRO-I, а в декабре выходят новые «Ёлки».
Полный бак №16. Тест Audi Q8
Наступила суббота, а значит, самое время для нашей автомобильной рубрики. Сегодня поговорим про самый красивый на сегодня автомобиль в кузове кросс-купе – Audi Q8
Ярмарка современного искусства Art Russia 2021. Технологии и не только
Современное российское искусство на ярмарке в Гостином дворе – художники и их работы. Что было интересного…
Так как у «Яндекса» не было своей ОС и смартфонов на ней, компании пришлось взять чужую разработку, а именно платформы mySPIN от немецкой Bosch. Стоит учесть, что mySPIN – это ни в коей мере не Android Auto и Apple CarPlay, а, по сути, программа, позволяющая дублировать информацию с экрана смартфона (Android/iOS), оптимизировав её под дисплей головного устройства. В отличие от отдельных автомобильных платформ от Google и Apple, у mySPIN есть множество костылей. Например, смартфон должен быть всегда активен, если его заблокировать, то соединение прервется, если вы вошли в другое приложение, то оно снова прервется, плюс смартфон может произвольно отвалиться от системы в самый неподходящий момент. При этом для повторной активации зачастую требуется перетыкать провод и заново запускать приложение на смартфоне. К тому же mySPIN, в нашем случае «Яндекс.Авто», должно поддерживать головное устройство автомобиля. Такое было с оригинальной платформой в Jaguar/Land Rover, так что в них практически сразу заработал «Яндекс.Навигатор»:
Наступила суббота, а значит, самое время для нашей автомобильной рубрики. С 9 августа владельцы автомобилей Jaguar и Land Rover получили доступ к платформе «Яндекс.Авто». Как это работает, мы сегодня и расскажем. Поехали!
И также Renault/Nissan стали интегрировать поддержку «Яндекс.Авто» в свои головные устройства:
Суббота, а значит, самое время для нашей автомобильной рубрики. Сегодня мы поговорим про «убийцу» Android Auto и Apple CarPlay от «Яндекса». Поехали!
Больше из автопроизводителей особо никто не решился сотрудничать с отечественным разработчиком и интегрировать в свои решения поддержку «Яндекс.Авто». Что, в целом, и логично, так как у многих за последние годы появилась поддержка Android Auto и Apple CarPlay, а этого более чем достаточно.
Весной этого года на собственном мероприятии руководство «Яндекса» сообщило о планах интегрировать «Яндекс.Навигатор» в Android Auto и Apple CarPlay, что, собственно, и произошло 4 августа. Оба навигационных приложения, хотя мне кажется, что пора бы их уже объединить, «Яндекс.Навигатор» и «Яндекс.Карты», получили обновление и стали доступны в автомобилях, поддерживающих соответствующие платформы.
Работает навигация без проблем что на Android Auto, что на Apple CarPlay, единственное, что нет некоторых фишек вроде зума пальцами, надо использовать виртуальные кнопки +/-, нельзя оставлять события, да еще редко, но навигация почему-то не перестраивает маршрут, хотя если переключиться на смартфон, то все срабатывает. Еще из недочетов отмечу, что «Яндекс.Карты», в отличие от Google Maps, не умеет останавливать свою работу, когда вы запарковались, так что навигацию приходится отключать ручками на смартфоне. А так красота: пробки, камеры, знаки – все это есть. Вся ваша история и записанные точки, поиск объектов, а также ввод адреса голосом. Единственный момент, как говорят в «Яндексе», из-за ограничений Apple и Google они не смогли интегрировать в программы сервис «Яндекс.Музыка», «Яндекс.Заправки» и своего голосового помощника Алису. Но первое уже есть отдельным приложением в Android Auto и Apple CarPlay, а для доступа ко второму вам просто надо переключиться на смартфон и с него уже заправлять свой автомобиль. Отсутствие Алисы в автомобиле особо не критично, так как со всеми необходимыми действиями неплохо справляются голосовые ассистенты Google и Apple.
Если у вашей компании есть адрес, куда приходят клиенты, вы можете лишний раз позаботиться о них. Избавьте пользователей от необходимости копировать адрес, открывать карты и искать, где вы находитесь.
На сайт можно вставить карту Google, Яндекс или 2ГИС с нужной меткой, чтобы пользователи могли сразу понять, куда им предстоит ехать. И дольше оставались на сайте, рассматривая карту и увеличивая время визита, что важно для поведенческих факторов и SEO. 😉
В статье:
Выбрать можно любую карту, какая вам больше нравится.
Как вставить Яндекс карту на сайт
Первый вариант: встроить Карту с уже существующей меткой
Откройте Яндекс.Карты, найдите компанию и скопируйте код для вставки:
Карта с меткой и информацией из Яндекс.Карт будет выглядеть так:
Организация на карте Яндекса
Найдите нужный адрес.
Выберите виджет с картой и скопируйте код для вставки. Можете сначала включить предпросмотр, чтобы увидеть, как она будет выглядеть.
Второй вариант: создать свою метку
Карта, которую мы сделали, выглядит так: у нее есть маркер с иконкой, которую мы выбрали, и отображается линия с пояснением для удобства.
Карта, созданная в конструкторе Яндекса
Создание карты пошагово:
Найдите адрес, выберите цвет и вид маркера.
Сохраните метку и добавьте еще адреса, если вы хотите отметить несколько филиалов.
При желании добавьте линии и нарисуйте фигуры, чтобы сделать маршрут понятнее. Линии можно изменять по изгибам улиц.
Интерактивная полезнее, ее можно двигать и масштабировать. Для вставки на сайт советуем ее.
Статическая будет выглядеть как картинка, ее можно распечатывать.
Задайте размер карты: можно ввести пиксели в окошке размера или растянуть карту вручную.
Если выбрать «Растянуть по ширине», у карты появится параметр width = 100%, то есть потом при вставке карты на сайт она займет всю ширину блока.
У кода iframe есть ограничения: пользователь не сможет переключать виды карты, то есть доступен только вид Схема, и она будет отображаться только на крупных масштабах.
Если вам нужно поменять язык топонимов, измените параметр lang в скопированном коде. Сейчас там lang=ru_RU, но можно поставить другой язык с помощью кода языка в формате ISO 639-1 и кода региона в формате ISO 3166-1: uk_UA — украинский для Украины, tr_TR — турецкий для Турции. Для пользователей из России и Украины регион и язык подстроится под настройки паспорта пользователя.
Вставьте код с картой Яндекса на сайт через редактор страницы.
Как вставить Google карту на сайт
Первый вариант: вставить карту из Google Maps с существующей меткой
Откройте Google Maps, найдите компанию и скопируйте код для вставки:
Карта будет выглядеть так:
Нажмите «Встраивание карт» и выберите размер из предложенных или выберите «Другой размер» и укажите свои параметры.
Скопируйте получившийся HTML-код и вставьте его в код своего сайта в то место, где вы хотите разместить карту.
Второй вариант: создать свою метку в Google Maps
Так выглядит созданная нами метка в режиме предпросмотра: на ней есть описание, которое мы ввели, фотография и информация из Google Maps.
Карта с меткой компании
Пошаговое создание метки на Google картах:
Введите адрес или название компании.
Укажите название, добавьте описание организации, фотографии, выберите цвет и стиль значка.
Скопируйте полученный код и вставьте его в код страницы, куда вы хотите добавить карту.
Как вставить карту 2ГИС на сайт
Встроить карту через API
Установить интерактивную карту 2ГИС можно через JS API — это версия API для простых задач.
Карта 2ГИС
Перейдите на страницу и выберите город.
Найдите компанию по названию.
Установите нужный размер карты в правом нижнем углу.
Нажмите «Далее», прочитайте Лицензионное соглашение и примите условия.
Нажмите «Получить код» и скопируйте его для вставки на сайт.
Это простая карта с готовой меткой, но можно сделать свою через Кjнструктор. Выручит, если вашей компании нет в 2ГИС.Создать в Конструкторе карту со своими метками
В 2ГИС есть бесплатный Конструктор карт, с его помощью можно создать карту со своей разметкой — добавить метки, описания, отобразить маршруты, графически выделить области.
Пошагово как сделать карту в Конструкторе 2ГИС:
Введите адрес и найдите нужное здание.
Настройте цвет метки, введите название.
Добавьте описание, можно вставить картинку с помощью разметки HTML или Markdown.
С помощью линий и выделения областей помогите клиентам сориентироваться по маршруту.
Выберите нужный размер карты.
Скопируйте код для вставки на сайт или в мобильное приложение.
Как настроить отложенную загрузку карты на сайте
Карты громоздкие, они влияют на загрузку сайта и могут тормозить отображение страницы.
Проверить скорость загрузки конкретной страницы можно в этом инструменте. Он бесплатно измеряет скорость загрузки в соответствии с показателем Google Core Web Vitals, оценивает разные этапы загрузки и дает рекомендации:
Фрагмент проверки
Минимизировать влияние карты на скорость загрузки страницы поможет отложенная или Lazy-load загрузка.
Загрузка карты по доскроллу до нее
Если карта находится внизу страницы далеко в футере или в поп-апе, можно настроить, чтобы она загружалась не сразу при переходе на страницу, а только когда пользователь до нее доскроллит.
Пользователь Хабра iefedorov для этого советует изменить код карты, который Google предлагает вставить на сайт.
Пример исходного кода:
Его нужно изменить вот так:
Браузер будет получать src = "", когда читателю понадобится карта.
Пошаговая настройка lazy-loading карты от Максима Васяновича (MaxGraph):
Загрузка карты после наведения курсора
Другой пользователь Хабра Dionisvl предлагает такой способ оптимизировать карту Яндекса, чтобы она подгружалась только при наведении на нее курсора мыши.
При создании карты в конструкторе Яндекса с использованием API-ключа получился примерно такой код:
На сайте нужно написать контейнер для блока с картой:
Также нужны стили для статичной картинки, подойдет скриншот.
Нужен JavaScript-код, который будет отслеживать события — наведение курсора мыши на карту или тап по карте на экране смартфона — и подменять статичное изображение на интерактивную карту:
Готово, теперь карта должна загружаться по наведении курсора или тапа на экран, если пользователь смотрит сайт с мобильного.
Проверить весь сайт на ошибки поможет сервис Анализ сайта: у него есть 70 тестов для анализа ваших и конкурентных проектов. Можно проверить не только главную, но и внутренние страницы. Оценит оптимизацию контента, ссылочную массу, технические параметры и другое.
Фрагмент проверки сайта
Расскажите в комментариях, как вы сделали карту для вашего сайта и как оптимизируете ее, чтобы она не сильно тормозила загрузку?
Многие автовладельцы спрашивают, как установить Яндекс Навигатор на Андроид Авто и можно ли этого сделать. Реализовать задачу реально, если иметь под рукой телефон с Android и автомобиль с поддержкой Android Auto. Ниже приведем инструкцию, как «подружить» софт, и что потребуется для достижения цели.
Можно ли запустить Яндекс Карты на Андроид Авто
Приложение Яндекс Навигатор пользуется большим спросом у автовладельцев из РФ, благодаря высокой точности карт, возможности быстрого планирования маршрута, прокладке кратчайшего пути и наличия голосовых подсказок. Если водитель плохо ориентируется по городу, программа подскажет, где повернуть, как объехать аварию и избежать пробок.
Вот почему многие задумываются о совместном применении Андроид Авто и Яндекс Навигатора, как подключить и настроить оборудование. Это реально, если иметь под рукой необходимые составляющие:
- Смартфон с ОС Андроид.
- Машина с портом USB и Андроид Авто, что это объяснять вряд ли нужно.
Если все «комплектующие» готовы, можно приступать к работе.
Как установить Яндекс Навигатор через Андроид Авто
Для подключения карт Yandex на Android Auto необходимо пройти несколько этапов. Во избежание ошибок рассмотрим их по отдельности.
Официальный способ
В августе 2021 года Яндекс.Карты на Андроид Авто появились официально. Поэтому стало намного проще с их установкой. Что нам потребуется:
- На вашем Android должна быть последняя версия Я.Карт (Я.Навигатора).
- Машина должна поддерживать и саму систему Android Auto.
- Плюсом ко всему нужно быть авторизованным под своей почтой и иметь действующую подписку «Яндекс.Плюс». Если ее нет, то попробуйте оформить бесплатный тестовый период на три месяца. Обычно это только для новеньких, но в компании говорят о том, что им могут воспользоваться и те, кто уже брал пробники в других сервисах Яндекса.
Перейдем к самому подключению:
- Подключите свой смартфон к машине с Андроид Авто. Можно сделать это с помощью провода и он сам предложит активировать систему. Более современные модели машин поддерживают и беспроводной режим, но учтите, что тогда телефон быстро сядет, поэтому провод считается более эффективным, особенно на дальние расстояния.
- Когда вы подключите устройство к машине, то на экране появится иконка Яндекс.Карт (или Я.Навигатора).
- Бывает, что при повторном запуске транспорт перестает видеть устройство. Поможет вам, если привязать машину в приложении Android Auto на смартфоне через настройки.
Ждать такой же функционал, как в приложении не стоит. Данная версия более урезана — упрощенный поиск и маршрут. Также карта не является интерактивной, поэтому можете тапать сколько угодно, вам удастся лишь перемещать карту пальцем и увидеть некоторые объекты на ней. Поэтому строить маршрут получится только в телефоне.
Сами результаты поиска отобразятся на экране бортового компьютера в виде точек на карте и нажать на нее не получится для конкретного места. Тоже самое касается и маршрутов — только через определенный список, которые высвечивает не более шести пунктов.
Данные ограничения не позволили встроить систему оплаты топлива и парковки, комментарии и «Алису». Вот помощницы в версии для Андроида нет, придется пользоваться встроенным роботом.
Неофициальный метод
Бывает, что у пользователей возникают проблемы с установкой по определенным причинам, например, нет подписки. Тогда придется воспользоваться более долгим и сложным способом, который приведен ниже.
Получите рут
Сразу отметим, что в этом способе объединить Android Auto и Яндекс Навигатор без рута не получится, поэтому советуем официальный способ. Для решения задачи существует множество приложений, доступных в Play Market. Как примеру, используйте KingRoot, FrameRoot, TowelRoot и другие. Преимущество ПО в том, что можно обойтись без компьютера и специальных программ.
Перед тем как сделать рут, учтите недостатки такого действия:
- риск выхода из строя телефона;
- нарушение стабильности работы девайса;
- потеря гарантии.
Еще раз подумайте, нужно ли вам добавлять Яндекс Карты в Андроид Авто таким способом.
Скачайте и настройте программу AAMirror
Перед тем как установить Яндекс Навигатор на Андроид Авто, загрузите оригинальный или модифицированный вариант AAMirror. При желании приложение легко найти и скачать на 4PDA. На данном этапе достаточно только установки на телефон. Запускать и настраивать софт пока не нужно.
Разблокируйте работу сторонних приложений
Чтобы поставить Yandex Навигатор на Android Auto, необходимо разблокировать работу сторонних программ. Для этого применяется AA Phenotype Patcher. Для выполнения работы сделайте следующие шаги:
- Загрузите софт с Интернета, к примеру, с портала github.
- Активируйте в Андроид Авто режим разработчика. Для этого войдите в приложение и откройте меню. Там найдите пункт О приложении и войдите в него. Кликните десять раз по надписи Об Андроид Авто. Если все сделано правильно, система должна вывести меню разработчиков. В нем выберите версию Рабочая и уберите отметку в графе загрузки с неизвестных источников (если она была установлена).
- Войдите в программу AA Phenotype Patcher.
- Кликните на три точки (меню) справа в углу и выберите пункт Triggers Manager.
- Дождитесь информации о системе. Здесь может быть два варианта — появляется окно с предложением убрать триггеры или информация об их отсутствии.
- Ставьте отметку и жмите Drop, а после перезапустите телефон.
- Справа вверху выберите закладку Apps List.
- Поставьте отметку на программе AAMirror. Ее легко распознать по символу телефона. Другие изменения вносить не нужно.
- Вернитесь в главное меню и жмите на кнопку Patch.
- Перезагрузите смартфон.
Сделайте настройки Android Auto
Перед тем как запустить Яндекс Навигатор на Android Auto, еще раз убедитесь в правильности выполненной выше работы. После этого зайдите в программу и сделайте следующие шаги:
- жмите на три горизонтальные полоски слева вверху;
- десять раз жмите на пункт Об Андроид Авто;
- выберите пункт Для разработчиков;
- поставьте отметку возле пункта Неизвестные источники.
Запустите и настройте AAMirror
В рассмотрении вопроса, как добавить Яндекс Навигатор в Андроид Авто, важный момент — настройка AAMirror. Войдите в приложение и дайте ему все необходимые разрешения. После этого введите необходимые настройки. Интерфейс программы состоит из нескольких строк:
- В Screen Setting задайте яркость, установите значение Force и 90 degree. Также установите опцию скрытия элементов, если это необходимо.
- В категории Sidebar Settings вы можете включить вертикальное меню и активировать отклик в два пальца.
- В секции Auio Settings ничего менять не нужно.
Теперь вы знаете, как настроить Яндекс Навигатор на Андроид Авто несколькими способами.
- Получение функций Яндекс Навигатор на Андроид Авто официально.
- Четкое распознавание голоса.
- Отсутствие полного функционала.
- Управление приложением возможно только со смартфона. При желании можно «разбудить» устройство обращением к голосовому помощнику.
Другие варианты навигаторов для Андроид Авто
Если вы не знаете, как включить Яндекс Навигатор в Андроид Авто, можно использовать другие приложения. Рассмотрим основные варианты:
- 2GIS. Это популярный софт для Андроид, пользующийся большим спросом. Главной особенностью программы является точное указание адресов больниц, магазинов, компаний и других учреждений. Кроме того, софт показывает ближайший объект и даже вход в него. Для работы не нужно подключение к Интернету, если карта города уже загружена.
Плюсы софта — работа без подключения к Сети, наличие в базе более 2,5 организаций, точная информация по пробкам, обновление базы.
Минусы — наличие рекламы и отсутствие в списке многих городов для работы без Интернета.
- Navitel Navigator. Это отличная навигация для Android Auto, которую можно использовать в качестве альтернативы Яндекс Навигатору. К преимуществам софта относится наличие подробных офлайн-карт, работе без Интернета, поддержка GPS и Glonass, отображение погоды и другие данные. Также приложение видит пробки, камеры видеофиксации, ДТП и другое. Минус в том, что за пользование картой необходимо платить.
- Google Карты. Это еще одно приложение для Андроид Авто вместо Яндекс Навигатора. По мнению многих автовладельцев, это лучший навигатор с позиции возможностей и удобства, но для России он не всегда подходит. Плюсы — наличие карт многих стран мира, фотографии популярных мест, быстрая загрузка и т. д. Из минусов — наличие рекламы, требование к Интернету и обрезанный функционал в некоторых странах.
Как вариант, можно использовать и Waze. Это бесплатное приложение, которое отлично прокладывает маршруты, видит пробки и хорошо делает прогнозы. Также с его помощью легко искать дешевые заправки. Стоит отметить, что программа хорошо функционирует, а если возникают проблемы и Waze не работает на Андроид Авто, то решить их можно самостоятельно. Минусы — наличие рекламы и требования к Интернету.
Теперь вы знаете, можно ли установить Яндекс Навигатор на Андроид Авто. Сделать это реально и простою Если вас не устраивает такой вариант, можно использовать альтернативные приложения.
Читайте также: