{"id":21769909,"url":"https://github.com/aerisweather/mapsgl-ios-webview","last_synced_at":"2025-04-13T16:32:35.997Z","repository":{"id":150177973,"uuid":"556797609","full_name":"aerisweather/mapsgl-ios-webview","owner":"aerisweather","description":"Displays a MapsGL map view in a WKWebView with native controls using a Swift and Javascript bridge.","archived":false,"fork":false,"pushed_at":"2023-03-28T16:14:28.000Z","size":74,"stargazers_count":5,"open_issues_count":1,"forks_count":1,"subscribers_count":4,"default_branch":"main","last_synced_at":"2025-03-27T07:21:23.445Z","etag":null,"topics":["data","forecast","googlemaps","leaflet","map","mapbox","maplibre","mapsgl","visualization","weather","webgl"],"latest_commit_sha":null,"homepage":"","language":"Swift","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/aerisweather.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2022-10-24T14:30:48.000Z","updated_at":"2024-11-10T21:13:08.000Z","dependencies_parsed_at":"2023-08-27T02:22:08.120Z","dependency_job_id":null,"html_url":"https://github.com/aerisweather/mapsgl-ios-webview","commit_stats":{"total_commits":19,"total_committers":2,"mean_commits":9.5,"dds":"0.052631578947368474","last_synced_commit":"2b3b75042c6d374e53176ea113aa168a99273206"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aerisweather%2Fmapsgl-ios-webview","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aerisweather%2Fmapsgl-ios-webview/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aerisweather%2Fmapsgl-ios-webview/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/aerisweather%2Fmapsgl-ios-webview/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/aerisweather","download_url":"https://codeload.github.com/aerisweather/mapsgl-ios-webview/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248743745,"owners_count":21154728,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["data","forecast","googlemaps","leaflet","map","mapbox","maplibre","mapsgl","visualization","weather","webgl"],"created_at":"2024-11-26T14:10:29.515Z","updated_at":"2025-04-13T16:32:35.962Z","avatar_url":"https://github.com/aerisweather.png","language":"Swift","funding_links":[],"categories":[],"sub_categories":[],"readme":"# mapsgl-ios-webview\n\nMapsGLWebView for iOS allows developers to effortlessly integrate our [MapsGL](https://www.aerisweather.com/products/mapsgl/) product and features into their iOS applications. It renders a map and weather data using a WKWebView and interacts with our [MapsGL Javascript SDK](https://www.aerisweather.com/docs/mapsgl/) using a Javascript-to-native bridge, allowing your to use native Swift or ObjectiveC code to control your map and its weather content.\n\nYou'll first need access to our AerisWeather data and services. If you don't already have an account and active subscription, [sign up for an AerisWeather Developer account](https://www.aerisweather.com/signup/developer/). Upon signing up, a demo application with your client ID and secret keys will be generated which you can use for your account configuration below.\n\n## Getting Started\n\nOur MapsGLView can be installed using [Swift Package Manager (SPM)](https://www.swift.org/package-manager/) or by manually including it in your project. \n\nTo use Swift Package Manager (SPM):\n\n1. Open your Xcode project or workspace, then go to **File \u003e Swift Packages \u003e Add Package Dependency**.\n2. Enter `https://github.com/aerisweather/mapsgl-ios-webview.git` as the URL, press **Enter** to pull in the package, and click **Add Package**.\n3. Once everything is fetched, select the **MapsGLWebView** library and then press finish.\n4. Copy the HTML file from `Sources/MapsGLWebView/HTML/mapview.html` into your own app bundle. This is the HTML file that is used for rendering your MapsGL map and weather layers using our [MapsGL Javascript SDK](https://www.aerisweather.com/docs/mapsgl/).\n5. In your code, you can now `import MapsGLWebView` to start using the features from this package.\n\nTo include the package manually, drag the package's files under `Sources` into your project's them into your app target within Xcode, optionally copying them into your directory.\n\n### Usage\n\nIncluding a MapsGL view in your app requires you to first set up your account using `MapsGLAccount` and providing your keys:\n\n```swift\nlet account = MapsGLAccount(id: \"CLIENT_ID\", secret: \"CLIENT_SECRET\")\n```\n\nYou can then creating an instance of `MapsGLView`, instantiating it with an instance of `MapsGLConfiguration` that contains your account information and any other supported options as [documented by our MapsGL Javascript SDK](https://www.aerisweather.com/docs/mapsgl/reference/map-controller/#configuration):\n\n```swift\nlet mapView = MapsGLView(config: configuration, frame: view.bounds)\nview.addSubview(mapView)\n```\n\n### Getting Map Information\n\nGetting information about the map, such as its current center coordinate, zoom level, whether it contains a particular weather layer, uses callbacks since communication between your native code and the underlying WKWebView happens asynchronously. \n\nFor example, to get the underlying map's current center coordinate:\n\n```swift\nmapView.getCenter { center in\n    print(center)\n}\n```\n\nThese methods also support async/await if you'd rather avoid callbacks:\n\n```swift\nlet center = await mapView.getCenter()\n```\n\n### Events and MapsGLViewDelegate\n\nMany of the applicable [events triggered](https://www.aerisweather.com/docs/mapsgl/reference/map-controller/#events) by the `MapController` instance of our MapsGL Javascript SDK are forwarded to your MapsGLView instance's delegate when assigned.\n\nThe following delegate methods are supported: \n\n```swift\nfunc mapsglViewDidLoad(mapView: MapsGLView)\nfunc mapsglViewDidZoom(mapView: MapsGLView)\nfunc mapsglViewDidMove(mapView: MapsGLView)\nfunc mapsglViewDidReceiveClick(mapView: MapsGLView, coordinate: CLLocationCoordinate2D)\nfunc mapsglViewDidStartLoading(mapView: MapsGLView)\nfunc mapsglViewDidCompleteLoading(mapView: MapsGLView)\nfunc mapsglViewDidAddSource(mapView: MapsGLView)\nfunc mapsglViewDidAddLayer(mapView: MapsGLView, layer: String)\nfunc mapsglViewDidRemoveSource(mapView: MapsGLView)\nfunc mapsglViewDidRemoveLayer(mapView: MapsGLView, layer: String)\nfunc mapsglViewDidUpdateLayers(mapView: MapsGLView)\nfunc mapsglViewDidStartAnimating(mapView: MapsGLView)\nfunc mapsglViewDidPauseAnimation(mapView: MapsGLView)\nfunc mapsglViewDidResumeAnimation(mapView: MapsGLView)\nfunc mapsglViewDidStopAnimating(mapView: MapsGLView)\nfunc mapsglViewDidAdvanceAnimation(mapView: MapsGLView, progress: Double, date: Date)\n```\n\n## Example App\n\nReview the example apps for Swift and SwiftUI (coming soon) in the `Examples` directory of this repository for more in-depth examples of how to use many of the features provided by MapsGLWebView. These example projects demonstrate how to set up your MapsGLView instance, how to use MapsGLViewDelegate, include a legend view, and how to implement native controls for your MapsGLView.\n\nNote that you will need to update the code in these example apps to provide your AerisWeather account keys in order for MapsGL functionality to work. You'll see lines like `MapsGLAccount(id: \"CLIENT_ID\", secret: \"CLIENT_SECRET\")` that you will need to update with your account access keys.\n\nThe example apps are also set up to use Mapbox for the base map in `mapview.html`. If you wish to use Mapbox, you'll need to update `mapview.html` with your Mapbox access token. Otherwise, you can use a different mapping library as described in the \"Customization\" section below.\n\n## Customization\n\nIf you're looking for even more customization options beyond what's supported by this MapsGLWebView package, you can clone this repo and update the included `mapview.html` file with additional configurations and options supported by our core [MapsGL Javascript SDK](https://www.aerisweather.com/docs/mapsgl/). \n\nBy default this package uses the Mapsbox JS GL SDK in `mapview.html`. However, if you'd rather use a different mapping library, you can change this in your app bundle's `mapview.html` by instantiating a different map instance and updating the map controller to one supported and provided by our MapsGL SDK. [Review our SDK documentation](https://www.aerisweather.com/docs/mapsgl/getting-started/) on how to configure its usage for different mapping libraries.\n\n## Support\n\nFeel free to post an issue in this Github repo for any bugs, technical issues or questions you may have related to this package. For sales information regarding our [MapsGL](https://www.aerisweather.com/products/mapsgl/) product and subscriptions, reach out to our [sales team](https://www.aerisweather.com/contact/sales/).","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faerisweather%2Fmapsgl-ios-webview","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Faerisweather%2Fmapsgl-ios-webview","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Faerisweather%2Fmapsgl-ios-webview/lists"}