Search code examples
iosswiftazure-maps

How to draw a pin in Azure Maps using azure WebSDK?

I was going through the documentation of azure maps to integrate in iOS app, Requirement is simple or put a pin in azure and on click of pin should display some info.

Created the credential and could load the map using html. Post that I am trying to understand how exactly we can pin to the map, I see everywhere native SDK is about the expire and rather suggested to use WebSDK , But how do we just put a pin when in the map which is generated using html. HTML file is copied from text. Guide doesn't seem to address the exact issue

` webView = WKWebView(frame: view.bounds) webView.navigationDelegate = self

            view.addSubview(webView)

            // Load local HTML file
            loadLocalHTMLFile()
    
         
    // Do any additional setup after loading the view.
}
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.")
       }
   }

I read the documentation and looked at the samples doesn't seem to address any issue putting the pin using swift

Solution

  • Adding a pin in Web SDK is nearly identical to the iOS native SDK. The main way is to create a data source for your data, then connect it to a rendering layer such as a Bubble or Symbol layer. This will use native WebGL rendering of the points allow you to render hundreds of thousands of points if needed.

    If you only need to render a few points, the Web SDK also has an HTML Marker class that is more similar to how older web map platforms used to render points.

    Here are a bunch of useful resources: