Skip to content

[BUG] Map is shown only when I move it #1944

@PollyGlot

Description

@PollyGlot

What is the bug?

I have already read a few of the issuses (ex. #1563 & #23) but anything could fix my problem.

I've got this problem with the latest version of the package 7.0.2. I have my markers shown but tiles are loaded only when I move the map. Even with the fix proposed here it doesn't work.

Here is my flutter doctor :

flutter doctor --verbose
[!] Flutter (Channel [user-branch], 3.22.3, on macOS 14.5 23F79 darwin-arm64, locale fr-FR)
    ! Flutter version 3.22.3 on channel [user-branch] at /Users/pollyglot/dev/flutter
      Currently on an unknown channel. Run `flutter channel` to switch to an official channel.
      If that doesn't fix the issue, reinstall Flutter by following instructions at
      https://flutter.dev/docs/get-started/install.
    ! Upstream repository unknown source is not a standard remote.
      Set environment variable "FLUTTER_GIT_URL" to unknown source to dismiss this error.
    • Framework revision b0850beeb2 (il y a 3 semaines), 2024-07-16 21:43:41 -0700
    • Engine revision 235db911ba
    • Dart version 3.4.4
    • DevTools version 2.34.3
    • If those were intentional, you can disregard the above warnings; however it is recommended to
      use "git" directly to perform update checks and upgrades.

[✓] Android toolchain - develop for Android devices (Android SDK version 34.0.0)
    • Android SDK at /Users/pollyglot/Library/Android/sdk
    • Platform android-34, build-tools 34.0.0
    • Java binary at: /Applications/Android Studio.app/Contents/jbr/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 17.0.11+0-17.0.11b1207.24-11852314)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 15.4)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 15F31d
    • CocoaPods version 1.15.2

[✓] Chrome - develop for the web
    • Chrome at /Applications/Google Chrome.app/Contents/MacOS/Google Chrome

[✓] Android Studio (version 2024.1)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
      🔨 https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 17.0.11+0-17.0.11b1207.24-11852314)

[✓] VS Code (version 1.92.1)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.94.0

How can we reproduce it?

I have my markers shown but tiles are loaded only when I move the map.

Here is what I have :

FlutterMap(
        mapController: mapController,
        options: MapOptions(
          // France as focus by default
          initialCenter: const LatLng(46.71109, 1.7191036),
          interactionOptions: const InteractionOptions(
            flags: InteractiveFlag.all & ~InteractiveFlag.rotate,
          ),
          onMapReady: () => mapController
            ..fitCamera(
              CameraFit.bounds(
                bounds: LatLngBounds.fromPoints([
                  if (proposal?.params?.receiver.location?.coordinates != null)
                    LatLng(
                      proposal!.params!.receiver.location!.coordinates[1],
                      proposal!.params!.receiver.location!.coordinates[0],
                    ),
                  if (proposal?.params?.sender.location?.coordinates != null)
                    LatLng(
                      proposal!.params!.sender.location!.coordinates[1],
                      proposal!.params!.sender.location!.coordinates[0],
                    ),
                ]),
                padding: const EdgeInsets.all(36),
              ),
            )
            // Fix proposed in the thread
            ..move(
              mapController.camera.center,
              mapController.camera.zoom + 0.0001,
            ),
        ),
        children: <Widget>[
          TileLayer(
            urlTemplate: 'https://tiles.yper.fr/default/{z}/{x}/{y}.png',
            userAgentPackageName: 'fr.yper.ypershopper',
            // fallbackUrl: 'https://tile.openstreetmap.org/{z}/{x}/{y}.png',
          ),
          MarkerLayer(
            markers: [
              if (proposal?.params?.sender.location?.coordinates != null)
                Marker(
                  width: 38,
                  height: 46,
                  point: LatLng(
                    proposal!.params!.sender.location!.coordinates[1],
                    proposal!.params!.sender.location!.coordinates[0],
                  ),
                  child: Stack(
                    children: [
                      YperSvg(YperAssets.res.assets.pickupMarker.path),
                      Padding(
                        padding: const EdgeInsets.only(bottom: 16.0),
                        child: Center(
                          child: Text(
                            "1",
                            style: Theme.of(context)
                                .textTheme
                                .titleLarge
                                ?.copyWith(
                                  fontWeight: FontWeight.w800,
                                  color: YperTheme.secondary400,
                                ),
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              if (proposal?.params?.receiver.location?.coordinates != null)
                Marker(
                  width: 38,
                  height: 46,
                  point: LatLng(
                    proposal!.params!.receiver.location!.coordinates[1],
                    proposal!.params!.receiver.location!.coordinates[0],
                  ),
                  child: Stack(
                    children: [
                      YperSvg(YperAssets.res.assets.receiverMarker.path),
                      Padding(
                        padding: const EdgeInsets.only(bottom: 16.0),
                        child: Center(
                          child: Text(
                            "2",
                            style: Theme.of(context)
                                .textTheme
                                .titleLarge
                                ?.copyWith(
                                  fontWeight: FontWeight.w800,
                                  color: Colors.white,
                                ),
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
            ],
          ),
        ],
      ),

Do you have a potential solution?

No response

Platforms

Android 14, iOS 17.4

Severity

Obtrusive: Prevents normal functioning but causes no errors in the console

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugThis issue reports broken functionality or another errorneeds triageThis new bug report needs reproducing and prioritizing

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions