Guía de migración del SDK de iOS de Azure Maps
La migración desde el SDK de iOS de Azure Maps al SDK web en una vista web implica la transición de la vista de mapa existente desde una implementación nativa a un mapa web mediante el SDK web de Azure Maps. En esta guía se muestra cómo migrar el código y las características del SDK de iOS al SDK web.
Nota:
Retirada del SDK de Azure Maps para iOS
El SDK nativo de Azure Maps para iOS ya está en desuso y se retirará el 31 de marzo de 2025. Para evitar interrupciones del servicio, migre al SDK web de Azure Maps antes del 31 de marzo de 2025.
Requisitos previos
Para usar el control de mapa en una página web, debe cumplir uno de los siguientes requisitos previos:
- Una cuenta de Azure Maps.
- Una clave de suscripción o credenciales de Microsoft Entra. Para obtener más información, consulte opciones de autenticación.
Creación de una vista web
Agregue una vista web si la aplicación de iOS no tiene ninguna. Puede hacerlo agregando WKWebView al guión gráfico o mediante programación en el código Swift. Asegúrese de que está configurado para ocupar el área deseada del diseño.
import UIKit
import WebKit
class ViewController: UIViewController, WKNavigationDelegate {
var webView: WKWebView!
override func viewDidLoad() {
super.viewDidLoad()
// Create WKWebView instance
webView = WKWebView(frame: view.bounds)
webView.navigationDelegate = self
view.addSubview(webView)
// Load local HTML file
loadLocalHTMLFile()
}
func loadLocalHTMLFile() {
if let htmlPath = Bundle.main.path(forResource: "map", ofType: "html") {
do {
let htmlString = try String(contentsOfFile: htmlPath, encoding: .utf8)
webView.loadHTMLString(htmlString, baseURL: Bundle.main.bundleURL)
} catch {
print("Error loading HTML file: \(error)")
}
} else {
print("HTML file not found.")
}
}
}
Configuración de un mapa con el SDK web de Azure Maps
En el archivo HTML, inicialice un mapa con su clave de suscripción. Reemplace <YOUR_SUBSCRIPTION_KEY> por la clave real.
<!DOCTYPE html>
<html>
<head>
<title>Azure Maps</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!-- Add references to the Azure Maps Map control JavaScript and CSS files. -->
<link rel="stylesheet" href="https://atlas.microsoft.com/sdk/javascript/mapcontrol/3/atlas.min.css" type="text/css"/>
<script src="https://atlas.microsoft.com/sdk/javascript/mapcontrol/3/atlas.min.js"></script>
<style>
html,
body,
#map {
margin: 0;
height: 100%;
width: 100%;
}
body {
display: flex;
flex-direction: column;
}
main {
flex: 1 1 auto;
}
</style>
<script type="text/javascript">
// Create an instance of the map control.
function InitMap() {
var map = new atlas.Map("map", {
center: [-122.33, 47.6],
zoom: 12,
authOptions: {
authType: "subscriptionKey",
subscriptionKey: "<YOUR_SUBSCRIPTION_KEY>"
}
});
// Wait until the map resources are ready.
map.events.add("ready", function () {
// Resize the map to fill the container.
map.resize();
});
}
</script>
</head>
<body onload="InitMap()">
<main>
<div id="map"></div>
</main>
</body>
</html>
Almacenamiento y ejecución de la aplicación. Se debe mostrar un mapa dentro de una vista web. Agregue las características o funcionalidades que quiera usar desde el SDK web. Encontrará más casos de uso en la documentación de Azure Maps y en los ejemplos de Azure Maps.
Comunicación entre código nativo y vista web (opcional)
Para habilitar la comunicación entre una aplicación de iOS y la vista web, puede usar el protocolo WKScriptMessageHandler que proporciona la clase WKWebView. Permite establecer un puente para la comunicación entre JavaScript que se ejecuta en la vista web y el código Swift. Para más información, consulte WKScriptMessageHandler en la documentación de WebKit de iOS.
Limpieza de una implementación de mapas nativos
Quite del proyecto el código relacionado con el SDK de la iOS de Azure Maps nativo, incluidas las dependencias y el código de inicialización relacionados con azure-maps-ios-sdk-distribution.
Prueba
Pruebe la aplicación exhaustivamente para asegurarse de que la migración se realizó correctamente. Compruebe si hay problemas relacionados con la funcionalidad del mapa, las interacciones del usuario y el rendimiento.
Pasos siguientes
Obtenga información sobre cómo agregar mapas a aplicaciones web y móviles mediante la biblioteca de JavaScript del lado cliente de Control de mapa de Azure Maps: