Průvodce migrací sady Azure Mapy iOS SDK

Článek
04/07/2024

Migrace ze sady Azure Mapy iOS SDK na webovou sadu SDK ve webovém zobrazení webview zahrnuje přechod existujícího zobrazení mapy z nativní implementace na webovou mapu pomocí sady Azure Mapy Web SDK. V této příručce se dozvíte, jak migrovat kód a funkce ze sady SDK pro iOS na webovou sadu SDK.

Poznámka:

Vyřazení sady Azure Mapy iOS SDK

Sada Azure Mapy Native SDK pro iOS je teď zastaralá a bude vyřazena 31. 31. 25. Pokud se chcete vyhnout přerušení služeb, proveďte migraci do sady Azure Mapy Web SDK do 31. 31. 25.

Požadavky

Pokud chcete použít ovládací prvek Mapování na webové stránce, musíte mít jednu z následujících požadavků:

Účet Azure Mapy.
Klíč předplatného nebo přihlašovací údaje Microsoft Entra. Další informace najdete v tématu Možnosti ověřování.

Vytvoření webového zobrazení

Pokud vaše aplikace pro iOS nemá webView, přidejte ji. Uděláte to tak, WKWebView že do scénáře přidáte text nebo programově v kódu Swiftu. Ujistěte se, že je nakonfigurovaná tak, aby zabírala požadovanou oblast vašeho rozložení.

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.")
        }
    }
}

Nastavení mapy pomocí sady Azure Mapy Web SDK

V souboru HTML inicializujete mapu pomocí klíče předplatného. Nahraďte <YOUR_SUBSCRIPTION_KEY> skutečným klíčem.

<!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>

Uložte a spusťte aplikaci. Mapa by se měla zobrazit v rámci webového zobrazení. Přidejte všechny funkce nebo funkce, které chcete použít z webové sady SDK. Další případy použití najdete v dokumentaci k Azure Mapy a ukázkách azure Mapy.

Snímek obrazovky mapy ve webovém zobrazení

Komunikace mezi nativním kódem a WebView (volitelné)

Pokud chcete povolit komunikaci mezi vaší aplikací pro iOS a WebView, můžete použít WKScriptMessageHandler protokol poskytovaný WKWebView třídou. Umožňuje vytvořit most pro komunikaci mezi JavaScriptem spuštěným ve webovém zobrazení a kódem Swift. Další informace naleznete v tématu WKScriptMessageHandler v dokumentaci k iOS WebKit.

Vyčištění nativní implementace mapování

Odeberte kód související s nativní sadou Azure Mapy iOS SDK z projektu, včetně závislostí a inicializačního kódu souvisejícího azure-maps-ios-sdk-distributions .

Testování

Důkladně otestujte aplikaci, abyste měli jistotu, že migrace proběhla úspěšně. Zkontrolujte problémy související s funkcemi mapování, interakcemi uživatelů a výkonem.

Další kroky

Naučte se přidávat mapy do webových a mobilních aplikací pomocí javascriptové knihovny Map Control na straně klienta v Azure Mapy:

Použití ovládacího prvku mapy Azure Mapy

Share via