[Bug]: Package does not support Web and causes duplicate class errors with google_maps_flutter

[jt274]

Is there an existing issue for this?

• I have searched the existing issues

Description of the bug

There are numerous issues about the duplicate class build errors when this package is used alongside google_maps_flutter (#129, #244, #247, #250).

However, the big problem is that this package is not compatible with Web platforms. This is partially understandable, since navigation will not work on the web - but the solution to many of these issues is that this package has a built in GoogleMapsMapView and to remove the google_maps_flutter dependency.

For a cross platform app, I want to use maps AND navigation on mobile platforms. On web, I still want to show maps only. Using google_navigation_flutter for mobile and google_maps_flutter for web does not work due to the build errors, and using google_navigation_flutter for all platforms doesn't work because it doesn't support web.

If these build issues cannot be fixed, can this package support GoogleMapsMapView on Web (or even better all) platforms?

Flutter version

3.35.6

Package version

0.6.5

Native SDK versions

• I haven't changed the version of the native SDKs

Flutter Doctor Output

Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.35.6, on Microsoft Windows [Version 10.0.26100.6584], locale en-US)
[√] Windows Version (Windows 11 or higher, 24H2, 2009)
[!] Android toolchain - develop for Android devices (Android SDK version 36.0.0)
! Some Android licenses not accepted. To resolve this, run: flutter doctor --android-licenses
[√] Chrome - develop for the web
[X] Visual Studio - develop Windows apps
X Visual Studio not installed; this is necessary to develop Windows apps.
Download at https://visualstudio.microsoft.com/downloads/.
Please install the "Desktop development with C++" workload, including all of its default components
[√] Android Studio (version 2025.1.4)
[√] VS Code (version 1.105.0)
[√] Connected device (4 available)
[√] Network resources

! Doctor found issues in 2 categories.

Steps to reproduce

1. Add google_navigation_flutter to your project.
2. Run on web.

Expected vs Actual Behavior

Package should work with web and allow maps to be shown without navigation.

Code Sample

// Example code here

Additional Context

No response

[illuminati1911]

@jt274 Thank you bringing up this issue.
You are right that this is a bit annoying when it comes to the web apps. We'll discuss about this internally and see what can be done about this.

[jt274]

@illuminati1911 Thank you - we are looking to add navigation to an enterprise app, but as it stands right now we'll be forced to use another mapping provider.

[illuminati1911]

Hey @jt274 . Right now you could handle this at least in two separate ways:

1. Directly use the Google Maps Flutter Web package without the app facing package nor the iOS and Android implementations for your web functionality.
2. Create a fork of the flutter/packages repo and remove iOS and Android packages from the pubspec.yaml of the google_maps_flutter library. Then use this fork as a source for your application instead of the official flutter repo.

[jt274]

@illuminati1911 Unless I'm mistaken this still would require two separate solutions for different platforms. We have somewhat complex map screens that are used across all platforms. We would need two completely separate implementations for every map screen (one for Web using google_maps_flutter_web and the other for mobile using google_navigation_flutter).

[illuminati1911]

@jt274 For the first suggestion I believe that would be true. On a high level I believe the APIs should be somewhat same, but it would introduce some extra work to implement same map functionalities directly with the web package.

As for the second suggestion, I don't think this would be the case as you are essentially using the same library but a different fork of it. You'd have to though make sure to use the fork for the web app and the official one for the mobile apps. Also you'd have to maintain the fork yourself to keep it up to date, but that shouldn't be too troublesome.

[jokerttu]

@jt274
Hi, yes, that’s correct, on Android and iOS you need to use the GoogleMapsMapView from the google_navigation_flutter package, and for the Web you need to use the API provided by the google_maps_flutter_web package.

You’ll also need separate converters, since types like LatLng use different classes between these libraries.

The reason for this conflict is that both the Android and iOS implementations of the Navigation SDK extend the Google Maps views at the native level, which causes compatibility issues with other map libraries, including native Google Maps SDKs. Because there’s currently no navigation support for the Web, this package doesn’t include Web support either.

[jt274]

@illuminati1911 @jokerttu This seems to be a better solution which allows the app to build on Android and Web. I have not tested in production or on iOS yet.

1. Add both google_maps_flutter and google_navigation_flutter packages to pubspec.yaml.
2. Use GoogleMap widget from google_maps_flutter to display maps on all platforms.
3. Use GoogleMapsNavigationView only on mobile to display navigation views where needed. Screens which load the google_navigation_flutter dependency should not be accessed by Web clients.
4. In build.gradle.kts add the following before the dependencies {} block:

configurations.all {
    exclude(group = "com.google.android.gms", module = "play-services-maps")
}

build.gradle equivalent:

configurations.all {
    exclude group: "com.google.android.gms", module: "play-services-maps"
}

This removes duplicate classes for the Android build and allows both packages to be used side by side on Android, as well as building on Web (without utilizing navigation screens on Web).

If you are able to verify this, perhaps it could be added to the docs?

[jokerttu]

@jt274
This solution does work, but it comes with a risk.
The google_maps_flutter and google_navigation_flutter packages may depend on different versions of the Google Play Services Maps library. If these versions differ, some methods expected by one package may not exist in the other, leading to potential runtime issues. A similar type of version conflict could also appear on iOS if the underlying SDKs diverge between the two packages.

If you choose to use this setup, I recommend pinning the exact versions (or allowing only patch level with ~) of both google_maps_flutter and google_navigation_flutter, as well as their transitive dependencies, such as google_maps_flutter_android and google_maps_flutter_ios, to known working versions with pinned version of the google_navigation_flutter.
In a Flutter app, this can be done by adding those packages as direct dependencies with fixed versions or, if necessary, by using dependency_overrides. Even minor updates can introduce mismatches, since they may update native SDKs without a major version bump, if breaking change are not introduced.

We’ll consider adding this approach to the documentation, along with a note about potential dependency conflicts and version drift across platforms.