Подтвердить что ты не робот

Как открыть приложение карты мобильного устройства, когда пользователь нажимает на ссылку?

У меня есть веб-приложение, где, если пользователь нажимает на ссылку, он должен открыть карту. Лучшее решение, которое я могу придумать, - открыть новую вкладку/окно для карт google с помощью атрибута target="_blank".

Но я думаю, что лучше было бы открыть приложение карты устройств вместо google map.

Я знаю, что пользовательское телефонное приложение может появиться, когда пользователь нажимает на номер телефона с атрибутом href, указывающим на tel:<the phone number>. Мне интересно, возможно ли это также с помощью приложения карты.

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

4b9b3361

Ответ 1

Вы можете использовать схему GEO URI "geo: широта, долгота", указанная RFC 5870 в ссылка, например

<a href="geo:124.028582,-29.201930" target="_blank">Click here for map</a>

Также есть comgooglemaps:, который запускает приложение Google Maps для iOS, например:

comgooglemaps://?center=40.765819,-73.975866&zoom=14&views=traffic

Где

  • center: Это центральная точка просмотра карты. Отформатирован как строка с разделителями-запятыми latitude, longitude.
  • mapmode: Устанавливает вид отображаемой карты. Может быть установлено: standard или streetview. Если не указано, будут использоваться текущие настройки приложения.
  • views: включение/выключение определенных видов. Может быть установлено: satellite, traffic или transit. Несколько значений могут быть заданы с помощью разделителя запятой. Если параметр указан без значения, то он очистит все виды.
  • zoom: указывает уровень масштабирования карты.

И как сказал techtheatre, вы можете использовать обычную ссылку Apple Maps для запуска Apple Maps:

//maps.apple.com/?q=Raleigh,NC

Отказ от протокола автоматически выберет правильный для использования, поэтому, если вы хотите иметь динамическую ссылку, вы можете просто создать условный код, который изменяет связь между google.com и apple.com в зависимости от того, какая система вы " re on.

Ответ 2

Фактически... теперь, когда у Apple есть собственное приложение карты, они больше не захватывают ссылки на карты Google и не маршрутизируют их в приложение сопоставления (по умолчанию... хотя это можно изменить на устройстве). Таким образом, теперь вы должны немного понюхать, чтобы определить, является ли устройство Android или Apple. Если вы используете правильную ссылку для правильной мобильной ОС, устройство поймает намерение и вместо использования браузера перейдет в приложение сопоставления.

Если Android, ссылка выглядит следующим образом:

https://maps.google.com/?q=Houston,+TX

Если Apple, ссылка вот так:

http://maps.apple.com/?q=Houston,+TX

Это, безусловно, боль, и, надеюсь, W3c в конечном итоге стандартизирует триггер карты (например, tel: для телефонных номеров). Удачи!

Ответ 3

Вот мое решение jQuery для этой проблемы. Я хотел быть в состоянии определить правильную карту, чтобы открыть. В 2019 году микроформаты все еще не создают ссылки на мобильные телефоны автоматически.

Я использовал решение из этой статьи https://medium.com/@colinlord/opening-native-map-apps-from-the-mobile-browser-afd66fbbb8a4, но изменил его, чтобы сделать его текущим и динамичным.

И, изменил код, чтобы я мог иметь адресный блок в моем HTML. Этот адрес разделен на основы и отправлен в соответствующее приложение карт.

HTML

<span class="map-link">6555 Hollywood Blvd<br/>Hollywood, CA 90028</span>

JavaScript

$(document).on('click','.map-link',function() {
    var address = $(this).html();
    address = $('<div/>')
      .html(address)
      .text() // strip tags
      .replace(/\s\s+/g, " "); // remove spaces
    address = encodeURIComponent(address);
    if ((navigator.platform.indexOf('iPhone') != -1) || (navigator.platform.indexOf('iPad') != -1) || (navigator.platform.indexOf('iPod') != -1)){/* if we're on iOS, open in Apple Maps */
        window.open('http://maps.apple.com/?q=' + address);
    } else { /* else use Google */
        window.open('https://maps.google.com/maps?q=' + address);
    }
});

CSS

.map-link { text-decoration: underline; text-decoration-style: dotted;cursor: pointer ;}
.map-link:hover { text-decoration-style:solid;}

Ответ 4

Не нужно ничего особенного. Вы можете просто дважды связать адрес, как это.

<a href='https://maps.google.com/?q=addressgoeshere'>
  <a href='https://maps.apple.com/maps?q=addressgoeshere'>
    Address</a></a>

На Android откроется приложение Google maps, а на iOS откроется приложение Apple maps. (Не проверено на Windows Phone)

Ответ 5

Для меня лучшим ответом была стандартизация тега карты, такого как "MAP:".

Затем, чтобы сделать адрес, вызовите карты, добавьте к нему MAP:

Поэтому, чтобы сообщить другу, где что-то, используйте что-то вроде: Map: 123 any street PA 98234.

Затем при нажатии на адрес (для телефона, который коснулся) вызывается приложение сопоставления по умолчанию.

Добавлено из комментария:

Идея была для электронной почты и текстовых сообщений, однако, если вы хотите пример кода, это работает на Android:

try
{
    String uri = "geo:0,0?q=" + Address;
    Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(uri));
    intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
    getApplicationContext().startActivity(intent);
}
catch (SecurityException es)
{
    if (LOG) Log.e("Dbg", "Map failed", es);
}
catch (ActivityNotFoundException e)
{
    if (LOG) Log.e("Dbg", "Map failed", e);
}

Ответ 6

Да, теги, подобные типу данных и т.д., не работали и для меня. Я использовал прямую ссылку от Google (вы можете выбрать "share point", и она даст прямой html, который укажет на местоположение).

Он откроет карты Google в браузере.