{"id":15098038,"url":"https://github.com/ionic-team/demo-capacitor-mapbox","last_synced_at":"2025-07-22T09:09:17.029Z","repository":{"id":38543565,"uuid":"265365556","full_name":"ionic-team/demo-capacitor-mapbox","owner":"ionic-team","description":"A Capacitor plugin for Mapbox SDK","archived":false,"fork":false,"pushed_at":"2023-07-12T02:20:15.000Z","size":8897,"stargazers_count":12,"open_issues_count":11,"forks_count":1,"subscribers_count":6,"default_branch":"master","last_synced_at":"2025-07-18T14:59:56.256Z","etag":null,"topics":["android","angular","capacitor","capacitor-plugin","ionic","mapbox","mapbox-android-sdk"],"latest_commit_sha":null,"homepage":"https://ionicframework.com/resources/webinars/capacitor-2-launch","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/ionic-team.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,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-05-19T21:00:27.000Z","updated_at":"2025-04-29T15:06:16.000Z","dependencies_parsed_at":"2024-09-15T16:18:05.400Z","dependency_job_id":null,"html_url":"https://github.com/ionic-team/demo-capacitor-mapbox","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/ionic-team/demo-capacitor-mapbox","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ionic-team%2Fdemo-capacitor-mapbox","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ionic-team%2Fdemo-capacitor-mapbox/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ionic-team%2Fdemo-capacitor-mapbox/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ionic-team%2Fdemo-capacitor-mapbox/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ionic-team","download_url":"https://codeload.github.com/ionic-team/demo-capacitor-mapbox/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ionic-team%2Fdemo-capacitor-mapbox/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":266463066,"owners_count":23932895,"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","status":"online","status_checked_at":"2025-07-22T02:00:09.085Z","response_time":66,"last_error":null,"robots_txt_status":null,"robots_txt_updated_at":null,"robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":["android","angular","capacitor","capacitor-plugin","ionic","mapbox","mapbox-android-sdk"],"created_at":"2024-09-25T16:42:34.478Z","updated_at":"2025-07-22T09:09:17.002Z","avatar_url":"https://github.com/ionic-team.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Demo: Building a Capacitor plugin for Mapbox\n\nThis is a reference app showing how to build a Capacitor plugin for [Mapbox](https://www.mapbox.com/), a mapping, vision, and navigation SDK for developers.\n\nTo see this app in action, check out the [Capacitor 2.0 Launch presentation](https://ionicframework.com/resources/webinars/capacitor-2-launch). Learn how to create your own cross-platform Capacitor plugin [here](https://capacitor.ionicframework.com/docs/plugins).\n\n## User Experience\n\nThis [Capacitor](https://capacitor.ionicframework.com) plugin wraps the [Mapbox Android SDK](https://docs.mapbox.com/android/maps/overview/). The plugin, when used in an Ionic Angular app, opens a full-screen map pointed at a variety of locations specified by the developer (based on latitude/longitude coordinates).\n\n## Implementation Details\n\n`capacitor-mapbox` contains the Mapbox plugin with Android implementation. The interface is defined in `src/definitions.ts`. The main Android code that leverages the Mapbox Android SDK is in `capacitor-mapbox/android/src/main/java/com/ionicframework/cap/mapbox/Mapbox.java`.\n\n`android` contains the Android app project.\n\nThe root of the project (and `src`) contains an Ionic Angular app, a modified version of the Ionic `blank` starter project. On the `Home` page, several buttons appear for different locations - tapping them displays a native Mapbox map, pointing at various lat/long coordinates. Point to different map locations by changing the coordinates in `home.page.html`.\n\n## How to Run\n\n- Install Ionic and native-run: `npm install -g @ionic/cli native-run`.\n- Clone this repository.\n- In a terminal, change directory into the repo: `cd demo-capacitor-mapbox`.\n\n### Build and link the Mapbox plugin:\n\nThe Capacitor Mapbox plugin is not published on npm (and shouldn't be since it's just a demo). That said, you can install and run it locally.\n\n- Change into the plugin directory: `cd capacitor-mapbox`.\n- Run `npm run build` to build the plugin.\n- Run `npm link`\n- Change back into the app directory: `cd ..`\n- Run `npm link capacitor-mapbox`\n- Run `npm install` to install all project dependencies, including the local `capacitor-mapbox` plugin.\n\n### Test the plugin\n\n- Sync the Android project: `npx cap sync`. If configured correctly, the log should print something similar to \"Found 1 Capacitor plugin for android: capacitor-mapbox (0.0.1)\"\n- Run `ionic build` to build the Ionic app.\n- Run `npx cap sync android` to sync the project again.\n- Run `npx cap open android` to open Android Studio. From here, connect a device then press play to try the app!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fionic-team%2Fdemo-capacitor-mapbox","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fionic-team%2Fdemo-capacitor-mapbox","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fionic-team%2Fdemo-capacitor-mapbox/lists"}