Ve más allá con MapKit

Hola, soy Alex. Soy ingeniero del equipo de MapKit. Con Mapas de Apple, puedes navegar y explorar lugares de todo el mundo desde tu dispositivo. Hay mucho por descubrir: lugares históricos, cálidas cafeterías, tiendas locales y bellas rutas de senderismo. Hoy, veremos las actualizaciones de MapKit y MapKit JS que trasladarán el mundo de los mapas a tus apps y sitios web. Comenzaré con PlaceDescriptor, una nueva forma de buscar y referenciar lugares. Luego, cubriré la geocodificación y cómo puedes usarla para mostrar información sobre un lugar. Por último, te ayudaré a llevar a las personas a donde quieran ir con nuestras direcciones y API de Echa un Vistazo. Comenzaré buscando y referenciando lugares. El año pasado, introdujimos un identificador para referenciar lugares con MapItems en MapKit y con Place en MapKit JS. Las referencias son únicas y mantienen su validez en el tiempo. Cada vez que el equipo de Mapas actualiza los datos de un lugar, como la URL, una app que usa Place ID puede mostrar esa información nueva. Como estos identificadores son únicos, la app los usa como claves en sus estructuras de datos. Los identificadores pueden conservarse y compartirse. Apple da seguimiento a los datos y puedes consultarlos en cualquier momento. Los identificadores de lugar son la mejor opción para conservar una referencia a un lugar específico que encontraste con MapKit. Pero hay algunos casos en los que podría no ser la mejor opción. A veces, se necesitan los datos de MapKit de un lugar específico, incluso sin tener identificador. Como cuando tienes una API web o CRM que da el nombre y la dirección de tus lugares de trabajo. O cuando tienes el nombre y las coordenadas de un lugar específico. En estos casos, ya sabes que quieres encontrar un lugar exacto y único. Entonces, las API como búsqueda local, que devuelve muchos resultados, no son la mejor opción. Otras veces, quiero pasar referencias de lugares hacia o desde un código que no me pertenece. Puedo vender lugares desde una estructura. O cuando uso App Intents, quizás quiera tomar un lugar como un parámetro de intent, devolver un lugar como un resultado de intent o incluir un lugar como una propiedad en las entidades de mi app. En estos casos, puede que estés interactuando con otras apps que no usan MapKit en absoluto. Aunque puedo usar CLLocation para una representación geográfica, no es ideal para encontrar un punto de interés rico, como lo haría con un identificador de MapKit. Para abordar estos casos, introducimos un nuevo tipo: PlaceDescriptor. Está en una nueva estructura: GeoToolbox. PlaceDescriptor te permite dar información que describe un lugar de forma estructurada.

MapKit u otros proveedores de servicios de mapas pueden usar un PlaceDescriptor para encontrar datos valiosos sobre ese lugar. Un PlaceDescriptor tiene tres elementos de información de nivel superior: una cadena llamada commonName. Al crear el PlaceDescriptor, debes ingresar nombres conocidos como el Museo Guggenheim o la Ópera de Sídney. Este campo no es para datos privados como “Casa” e incluirlo no contribuye a que MapKit encuentre el lugar.

PlaceDescriptor también tiene un conjunto de representaciones. Estas son formatos comunes que toda app o estructura que maneje información geográfica debería comprender. Puedes elegir entre tres tipos de PlaceRepresentations. El primero es una cadena de dirección, como la que escribirías en un sobre. Brinda la dirección más completa posible para mejorar las probabilidades de que MapKit encuentre el lugar. El siguiente es una coordenada para elementos en un punto fijo definido, como un punto de referencia o un local comercial. Por último, la ubicación del dispositivo, que usa CLLocation. Es ideal para datos GPS recibidos y puede incluir precisión, marca de tiempo, rumbo o velocidad. El conjunto de representaciones debe contener al menos una representación y está en orden de precedencia decreciente. Si un PlaceDescriptor proviene de una app de contactos, puede que se haya derivado una coordenada de la dirección de ese lugar. En ese caso, la dirección vendría primero ya que es la fuente original de información y la coordenada vendría en segundo lugar. Por último, PlaceDescriptor dispone de un conjunto de representaciones de soporte. Es posible que no todas las apps puedan usar estas representaciones y no son obligatorias. El conjunto supportingRepresentations puede estar vacío. Hablaremos sobre lo que puede haber en supportingRepresentations más adelante. Para demostrar PlaceDescriptor y todas las demás API nuevas que están surgiendo, explicaré una app de ejemplo. Los aficionados a las fuentes pueden encontrarlas en lugares lejanos de todo el mundo. Me gustaría empezar recopilando fuentes en Dublín que sería interesante visitar y las pondré en un mapa.

Desde la introducción de MapKit para SwiftUI, puedo hacer un marcador simple en el mapa con una coordenada, pero me gustaría aprovechar los datos importantes de Mapas de Apple sobre las fuentes junto con todas las demás API de MapKit en mi app, aunque no tenga un Place ID. Una gran oportunidad para usar PlaceDescriptor. Vamos a crear un PlaceDescriptor para hacer referencia a esta fuente. Primero, importaré GeoToolbox. Sé que hay una fuente en estas coordenadas. Entonces, al crear mi PlaceDescriptor, les facilitaré una representación de coordenadas. Por último, sé que se llama Fuente de Ana Livia, por eso también la ingreso. Eso es todo lo que necesito hacer para crear un PlaceDescriptor válido. Puedo importar MapKit y crear una solicitud de elemento de mapa con mi PlaceDescriptor. Cuando tengo la solicitud, puedo ejecutarla para obtener un MKMapItem para ese lugar. MapItem es el tipo principal para lugares en MapKit y puedo usarlo con todo tipo de API.

Por ejemplo, puedo usar MapItem en un mapa. Verás que el marcador muestra el nombre, los colores y la iconografía que Mapas de Apple tiene para este lugar.

Agregaré un segundo lugar al mapa, esta vez usando una dirección para crear el descriptor. Solo necesito proporcionar la versión más completa de la dirección que tengo de esta fuente. Luego, puedo hacer un PlaceDescriptor con esa información y el nombre de la fuente. Uso MKMapItemRequest como antes y lo agrego al mapa con mi otra fuente. Es realmente así de fácil. Mostré cómo usar PlaceDescriptor para encontrar un lugar por nombre y cómo coordinar y agregar direcciones de PlaceRepresentations. Pero hay una propiedad más de nivel superior de PlaceDescriptor que puedes usar. Hay un único tipo de representación de soporte: los identificadores de servicio. Una representación de identificador de servicio es un diccionario donde la clave es el identificador del paquete para un servicio de mapas determinado y el valor es el identificador que representa el lugar para ese servicio de mapas.

Si conozco el identificador de lugar MapKit para un lugar, puedo crear un diccionario donde la clave sea com.apple.mapKit y el valor sea el identificador. Luego, creo una representación serviceIdentifiers y la paso al parámetro supportingRepresentations del inicializador PlaceDescriptor. Si sé el identificador de un lugar de otro proveedor de servicios de mapas, puedo proporcionarlo aquí. MapKit no usa otros identificadores, pero proporcionarlos puede ser útil en escenarios como App Intents, donde puedes proporcionar un PlaceDescriptor a otra app que puede no usar MapKit. Puedes proporcionar tantos identificadores como desees. Si usas la API de MapKit, siempre hacemos lo correcto con los identificadores de servicio. Si está presente, MKMapItemRequest usará los identificadores de MapKit de tu PlaceDescriptor para obtener el lugar. Si no hay un identificador de MapKit, o si el uso del identificador proporcionado falla, se usarán las otras representaciones en PlaceDescriptor para encontrar el lugar. Asimismo, si creas un PlaceDescriptor con un MapItem que obtuviste de otra forma, nos aseguraremos de que el PlaceDescriptor se complete con todas las representaciones necesarias, incluido el identificador. Usaré PlaceDescriptor y MKMapItemRequest para agregar el resto de las fuentes de Dublín que conozco a mi app. Los MapItems solicitados con un PlaceDescriptor se pueden usar con todas nuestras API de MapKit para mostrar datos de mapas enriquecidos como los obtenidos por identificador o con MKLocalSearch.

Por ejemplo, las tarjetas de ubicación. Cuando presentas una tarjeta de ubicación solicitada por PlaceDescriptor, podemos mostrar datos completos y actualizados, como el horario de atención, así como un enlace a Mapas de Apple. Puedo mostrar una tarjeta de ubicación cuando alguien selecciona una fuente en mi app con solo una línea de código. Las tarjetas de ubicación son una forma sencilla de mostrar información interesante sobre un lugar en tu app. Para más información, consulta “Desbloquea el poder de los lugares con MapKit” de la WWDC2024.

Este año, las tarjetas de ubicación en MapKit JS también facilitan un enlace universal a Mapas de Apple. En los dispositivos con la app Mapas instalada, los enlaces se abrirán allí. Para los dispositivos que no tienen una app de Mapas, la tarjeta de ubicación se enlaza a maps.apple.com, que lanzamos la temporada pasada en versión beta pública. Cuando tus apps y sitios web estén vinculados a Mapas de Apple, incluso aquellos en plataformas que no sean de Apple podrán usar Mapas en Internet para explorar más. Con el lanzamiento de iOS 18.4, actualizamos la forma en que Mapas maneja las URL, para que puedas crear enlaces universales similares con confianza. Por ejemplo, esta URL para realizar una búsqueda. Hicimos que los parámetros sean más consistentes, más simples y más fáciles de leer.

También agregamos muchos parámetros adicionales para vincular a incluso más funcionalidades en Mapas. Consulta “Adopción de URL unificadas de Mapas” vinculada en los materiales de este video.

Bien, encontré mis lugares. A continuación, te mostraré cómo usar la geocodificación y las representaciones de direcciones para mostrar más información sobre los lugares en tu app.

La geocodificación directa es el proceso de tomar una dirección y encontrar la coordenada a la que hace referencia. Un ejemplo es tocar una dirección en la app Contactos, lo que te llevará a un mapa.

La geocodificación inversa es lo opuesto. Tú proporcionas una coordenada y nosotros te damos una dirección. Un ejemplo es cuando colocas un pin en la app Mapas y te mostramos la información de la dirección de esa ubicación.

En iOS 18 y versiones anteriores, usaría CoreLocation para tareas de geocodificación. Este año, dejaremos de usar CLGeocoder, dejaremos de usar CLPlacemark temporalmente y traeremos la geocodificación a MapKit.

En la app, también daré seguimiento a las fuentes que encontré y de las que tomé fotos enmarcadas. Estas incluyen una etiqueta geográfica, con las coordenadas de dónde se tomaron, pero no tengo información de respaldo, como un nombre. No puedo usar PlaceDescriptor para encontrar el lugar enriquecido. Todo lo que tengo son coordenadas. Usaré la geocodificación inversa en MapKit para encontrar más contexto para las fotos.

Vamos a geocodificar de forma inversa la primera foto de una fuente. Primero, las coordenadas donde se tomó la foto. Haré un MKReverseGeocodingRequest con esa ubicación. A diferencia de MKMapItemRequest con PlaceDescriptor, que mostré antes, el inicializador de MKReverseGeocodingRequests devuelve un opcional. Si proporcionas una CLLocation con coordenadas no válidas, MapKit no podrá realizar la solicitud. Cuando la solicitud regresa, obtengo un conjunto de elementos del mapa. Este conjunto debe tener una sola entrada para la mayoría de las solicitudes de geocodificación. Así que elegiré la primera. Ten en cuenta que, ya que este elemento de mapa proviene de una API de geocodificación, no incluirá información completa sobre un lugar de interés. Este mapItem solo contiene información sobre el punto de dirección. Ahora que tengo el mapItem, puedo mostrar la dirección.

Usaré la solicitud MKReverseGeocoding para obtener una dirección para el resto de las fotos y mostrarlas en una lista. Mi app empieza a tomar forma, pero quizás la dirección completa puede ser demasiado detallada para esta pantalla. Así que revisaré qué otras opciones tengo. MKMapItem proporciona dos propiedades opcionales para acceder a la información de la dirección. Primero, MKAddress. Puedes crear una instancia de tu propio MKAddress cuando creas tu propio MKMapItem. Además, MapKit también ofrece una MKAddress al devolver MapItems desde API como geocodificación, búsqueda local y resolución PlaceDescriptor. Segundo, MKAddressRepresentations, que no tiene un inicializador. Las representaciones de direcciones solo están disponibles en los elementos de mapa devueltos desde las API de MapKit.

Hablaré de MKAddress primero. Tiene dos propiedades de cadena, fullAddress y shortAddress.

FullAddress es la versión más completa de una dirección postal o administrativa. ShortAddress solo proporciona las partes más cruciales.

En algunos casos, la dirección que proporcionamos puede ser muy breve. Por ejemplo, un geocódigo inverso de coordenadas en medio del océano puede ser de solo una línea.

Al crear una instancia de un MapItem propia, la propiedad de dirección se usa en las tarjetas de ubicación de MapKit, así puedes mostrar tu propia información de dirección.

MKAddress ofrece versiones simples de una dirección, y MKAddressRepresentations proporciona muchas formas potentes de mostrar información de dirección en tu app. Si muestras una lista de direcciones, puedes omitir la región en tu app si sabes que todas están en el mismo país. Para ello, puedes usar la dirección completa, incluida la región, false. O tal vez quieras enumerar la ciudad y algún otro contexto sobre dónde está. A veces, puede que desees proporcionar un estado o provincia, como Los Ángeles, California. En otras ocasiones, querrás incluir el país, como París, Francia. MapKit simplifica la elección de la dirección, información regional y local del dispositivo que solicita el elemento del mapa. Ahora que conozco las opciones de representación de direcciones, usaré cityWithContext en mi app para mostrar información de dirección más concisa con las fotos. Mi app ahora muestra el nivel de detalle correcto y se ve genial.

La API para geocodificación directa es muy similar a la geocodificación inversa. Con MKGeocodingRequest, puedo recuperar un MapItem, esta vez para mi dirección. Esto hace que sea muy fácil acceder a las coordenadas o agregarlas a un mapa. También incluye todas las opciones que analizamos para la información de dirección, así que puedo obtener las distintas representaciones de visualización para mi dirección que no tenía antes de hacer la solicitud de geocodificación.

Ya tengo los lugares y su información. Ahora mostraré las API de MapKit para ayudarte a navegar hasta ellos. MapKit ofrece una API de direcciones que encuentra rutas entre origen y destino, con opciones de modos de transporte. Indicaciones te ofrece tiempos y distancias estimados, además de detalles paso a paso de tu ruta.

En la vista del mapa de Dublín, quiero planificar indicaciones a las fuentes que seleccioné. Permitiré la selección en el mapa proporcionando un enlace de elemento de mapa en el inicializador de mapas. Luego, puedo calcular la ruta cuando cambia el elemento seleccionado. Para obtener más información sobre cómo administrar la selección de mapas, consulta “Conoce MapKit para SwiftUI” de la WWDC 2023. Para obtener la ruta, primero creo una solicitud de direcciones. Luego, configuro la ubicación actual del dispositivo como origen y el elemento del mapa seleccionado como destino. A continuación, creo un objeto de direcciones. Y, finalmente, calculo la ruta. Me aseguraré de solucionar cualquier error y después procesaré la respuesta. ¿Pero qué hay en la respuesta a una solicitud de direcciones?

Te devolveremos el origen y el destino que hayamos emparejado para tu ruta. Estos pueden ser un poco diferentes de lo que proporcionaste en la solicitud. Por ejemplo, las instrucciones para llegar en auto pueden considerar el estacionamiento, y las instrucciones para caminar pueden llevarte directamente a la puerta de un edificio.

También incluimos un conjunto que tiene una o más rutas que satisfacen la solicitud.

Las rutas tienen mucha información importante, incluido un nombre localizado que puedes usar como título para una ruta, un conjunto de avisos relevantes para la ruta, como cierres de carreteras, la distancia requerida para viajar en esa ruta en metros, el tiempo que tomaría viajar en esa ruta y la geometría de la ruta, adecuada para dibujar en un mapa.

Este año, agregamos la compatibilidad con indicaciones para bicicletas en MapKit. En mi app, ir en bicicleta es la forma perfecta de ver las fuentes de Dublín. Es tan simple como modificar una propiedad en la solicitud de direcciones. Usaré la primera ruta en bicicleta de la respuesta para mostrar las indicaciones. Y la agregaré a mi mapa con MapPolyline. Así de fácil es mostrar direcciones.

Las rutas en bicicleta con MapKit son potentes. Aprovechan caminos y senderos no aptos para autos y evitan ciertos caminos no aptos para bicicletas. Con MapKit JS, también puedes obtener indicaciones para ir en bicicleta y tiempos de llegada estimados. Como con Swift, todo lo que debo hacer es agregar una línea de configuración a la solicitud de indicaciones para especificar el ciclismo como transporte.

¡También me entusiasma compartir que, por primera vez, ahora puedes obtener direcciones con MapKit en watchOS! De hecho, más de 20 API de MapKit llegaron al Apple Watch con el SDK de watchOS más reciente.

Ahora que tengo una buena ruta en bicicleta para mi recorrido, me gustaría explorarla antes. Al habilitar la funcionalidad Echa un Vistazo de Mapas, puedo obtener imágenes interactivas de 360 grados de la ciudad a nivel de calle y obtener fácilmente una vista previa de las carreteras, los carriles para bicicletas, el estacionamiento y los lugares de interés.

Al incorporar Echa un Vistazo en las apps de MapKit en iOS 16, se incluyen API para verificar si las imágenes están en una ubicación determinada, obtener una vista previa de las imágenes y presentarlas en pantalla completa. Consulta la sesión “Novedades de MapKit” de la WWDC 2022 para más información.

Este año, incluimos Echa un Vistazo en MapKit JS para que puedas habilitarlo en tu sitio web o app web. Puedes agregar dos tipos de vistas de Echa un Vistazo.

El primero es una vista interactiva que puedes integrar en tu IU, que permite al usuario navegar. El segundo es la vista previa de Echa un Vistazo. Esto ofrece una instantánea estática de las imágenes en la ubicación deseada. Al hacer clic en la vista previa, se inicia una experiencia interactiva en pantalla completa. Para agregar este tipo de vista interactiva al sitio web, primero preciso un objeto de lugar. Puedo usar cualquier API de MapKit JS que devuelva un lugar, como una búsqueda de lugar, una búsqueda o una geocodificación. Aquí, tengo un identificador, así que usaré placeLookup. Luego, creo un objeto de Echa un Vistazo pasando el elemento DOM que lo contiene, así como el objeto de lugar y, finalmente, un diccionario de opciones. LookAroundView admite tres opciones. La primera es openDialog. Cuando esta opción es true, LookAroundView cubrirá toda la ventana del navegador. La segunda es showsDialogControl. Cuando esto es true, aparece un botón en LookAroundView que te permite entrar y salir de la experiencia de ventana completa. Por último, showsCloseControl. Cuando es true, se incluye un botón que cierra la vista Echa un Vistazo. MapKit JS emitirá varios eventos relacionados con LookAroundView. Puedes agregar receptores de eventos para responder o anular comportamientos predeterminados. Por ejemplo, cuando el usuario toca el botón de cerrar, se envía un evento de cierre. Puedes usar esta devolución de llamada para animar o cambiar el estado de la app.

Si no cancelas la acción predeterminada para este evento, LookAroundView se eliminará del DOM. Otros eventos que quizás quieras administrar incluyen: El evento de carga, que se envía cuando la vista está completamente cargada. Error, que se envía cuando hay un problema. Por ejemplo, cuando las imágenes no están disponibles o el navegador no puede mostrar la vista. MapKit JS proporciona una IU de error, pero puede que desees tener tu propia experiencia de error o alternativa. Finalmente, lookAround envía eventos readystatechange, que puedes usar para monitorear el ciclo de vida de la vista. El estado listo cambia cuando la vista se está cargando, termina de cargarse, tiene un error o se elimina del DOM. También puedes usar la API LookAroundPreview para lograr una experiencia más sencilla. Las vistas previas de Echa un Vistazo no son interactivas. El usuario no puede desplazarse por la vista. Al hacer clic en la vista previa de Echa un Vistazo se inicia una experiencia en la ventana completa. Creo que Echa un Vistazo con MapKit JS llevará tus sitios web al siguiente nivel. Y con esto finaliza nuestra sesión. Fue una fuente de conocimiento. Mostré formas de encontrar lugares, mostrar información de lugares y navegar a lugares de todo el mundo con MapKit y MapKit JS.

Antes de irnos, déjame darte algo de tarea. Usa PlaceDescriptor para encontrar lugares con o sin un identificador y para enviar referencias de lugares a otras apps. Actualiza todos los enlaces a Mapas de Apple para usar nuestro nuevo formato de URL unificada.

Mueve tus apps de CoreLocation a las API de MapKit para geocodificación y aprovecha nuestras excelentes representaciones de direcciones. Por último, agrega indicaciones para ir en bicicleta y Echa un Vistazo a tu app para ayudar a la gente a llegar a su destino.

¡Gracias por acompañarnos y aprender sobre MapKit conmigo hoy!