KMP-MapBox is a Kotlin Multiplatform library that instantiates the Map from MapBox libraries, in Android and in Web. It simplifies your life by creating the map for you. You can fully use overlays in your own project, using Kotlin for Android or HTML for Web.

HTML is needed for Web, because MapBox JS returns a GL, and since it is an HTMLElement, it can't have any Kotlin components in overlay. If MapBox puts Wasm as target, then HTML will no longer be needed and the UI will be shared, but for now, not possible. You can still use ComposeViewport though, just no Kotlin Component as overlay.

VERY IMPORTANT: Always have your version in the newest one, since all the other tend to be "deleted".

This ADR file (Architecture Decision Record) is an arranged and documented list of decisions done, for code or project structure, to help AI or developers to not make mistakes done before. Click here for ADR file

Beside creating the map, you can retrieve your position with latitude, longitude and altitude. The map uses Fine Location, in Android, for user location, which will retrieve the most accurate value possible. The map also lets the user lock in its position, and lets the user put the camera in follow direction mode.

One important note is that the Web target isn't as evolved as the Android one, simply because of the problems with the Composable/HTML and everything, JS works fine, but cover about 70% of the full implementation of Android.

To use the library it is important to have a Mapbox token, that you can get if by creating an account. This token needs to be passed to the MapWrapper. If you don't want to put it hardcoded, and you are using both Android and Web, I recommend using library buildKonfig (https://github.com/yshrsmz/BuildKonfig), it's a plugin that let's build config work for Android and all the other targets. If you need help configuring it, look at build.gradle.kts (:webApp).

To set up the library you need to put in your build.gradle:

implementation("io.github.tiagopraia:kmp-mapbox:0.3.10")

or if using libs.versions.toml:

• in libs.version.toml:

  [versions]
  (...)
  kmp-mapbox-version = 0.3.10
  
  [libraries]
  (...)
  kmp-mapbox = { module = "io.github.tiagopraia:kmp-mapbox", version.ref = "kmp-mapbox-version" }
  

• in build.gradle (depends on project structure):

  kotlin {
      sourceSets {
          commonMain.dependencies {
              implementation(libs.kmp.mapbox)
          }
      }
  }

  OR

  dependencies {
      implementation(libs.kmp.mapbox)
  }

Since this library depends on other libraries, you need to have them in your project too. (These are the versions library has):

• They don't need to be together, since one is strictly Android and the other is strictly Web

  dependencies {
  implementation("org.jetbrains.compose.html:html-core:1.11.1)
  implementation("com.mapbox.maps:android:11.9.0")
  }

• This one goes into the build.gradle even if using libs.versions.toml

  implementation(npm("mapbox-gl", "3.9.4"))

• In settings.gradle.kts:

  dependencyResolutionManagement {
      repositories {
          google {
              mavenContent {
                  // Can have others, but chromium with necessary
                  includeGroupAndSubgroups("org.chromium")
              }
          }
          maven {
              url = uri("https://api.mapbox.com/downloads/v2/releases/maven")
          }
      }
  }