Skip to content

[google_maps_flutter][iOS] Polygon borders (stroke) on the map are drawn incorrectly #168663

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Open
enescerrahoglu opened this issue May 12, 2025 · 5 comments
Open

[google_maps_flutter][iOS] Polygon borders (stroke) on the map are drawn incorrectly #168663

enescerrahoglu opened this issue May 12, 2025 · 5 comments
Labels
found in release: 3.29 Found to occur in 3.29 found in release: 3.33 Found to occur in 3.33 fyi-ecosystem For the attention of Ecosystem team has reproducible steps The issue has been confirmed reproducible and is ready to work on p: maps Google Maps plugin P2 Important issues not at the top of the work list package flutter/packages repository. See also p: labels. platform-ios iOS applications specifically team-ios Owned by iOS platform team triaged-ios Triaged by iOS platform team

Comments

@enescerrahoglu
Copy link

enescerrahoglu commented May 12, 2025 •
edited
Loading

Steps to reproduce

  1. Use the polygon data provided in the following JSON file:
    https://raw.githubusercontent.com/enescerrahoglu/polygon-data/refs/heads/main/data.json

  2. Parse this data and render the polygons on the map using the Polygon widget provided by the google_maps_flutter package.

  3. Test the app on a real iOS device (not a simulator).

Expected results

Polygon borders (stroke) should be rendered correctly on the map, maintaining their shape and alignment regardless of the zoom level or device.

Actual results

On a real iOS device, polygon borders are drawn incorrectly. The stroke appears misaligned or distorted, especially at certain zoom levels. This issue is not reproducible on Android devices or the iOS simulator.

Code sample

Code sample 
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:http/http.dart' as http;

class GoogleMapView extends StatefulWidget {
  const GoogleMapView({super.key});

  @override
  State<GoogleMapView> createState() => _GoogleMapViewState();
}

class _GoogleMapViewState extends State<GoogleMapView> {
  Set<Polygon> polygons = const <Polygon>{};

  @override
  void initState() {
    super.initState();

    WidgetsBinding.instance.addPostFrameCallback(
      (timeStamp) async {
        polygons = await getPolygons();
        setState(() {});
      },
    );
  }

  Future<Set<Polygon>> getPolygons() async {
    final url = Uri.parse('https://raw.githubusercontent.com/enescerrahoglu/polygon-data/refs/heads/main/data.json');
    try {
      final response = await http.get(url);
      if (response.statusCode == 200) {
        final List<dynamic> data = jsonDecode(response.body)['AllPolygons'];
        final Map<int, List<LatLng>> holesMap = {};

        // Group holes by ParentId
        for (var polygonData in data) {
          if (polygonData['ParentId'] != 0) {
            final List<LatLng> points =
                (polygonData['Polygon'] as List<dynamic>).map((point) => LatLng(point['Lat'], point['Lng'])).toList();
            holesMap.putIfAbsent(polygonData['ParentId'], () => []).addAll(points);
          }
        }

        final Set<Polygon> polygons = data.where((polygonData) => polygonData['IsPolygon'] == true).map((polygonData) {
          final List<LatLng> points =
              (polygonData['Polygon'] as List<dynamic>).map((point) => LatLng(point['Lat'], point['Lng'])).toList();
          final List<List<LatLng>> holes = holesMap[polygonData['Id']] != null ? [holesMap[polygonData['Id']]!] : [];
          return Polygon(
            polygonId: PolygonId(polygonData['Id'].toString()),
            points: points,
            holes: holes,
            strokeWidth: 2,
            strokeColor: Colors.orange,
            fillColor: Colors.orange.withValues(alpha: 0.2),
          );
        }).toSet();

        return polygons;
      } else {
        throw Exception('Failed to load polygons');
      }
    } catch (e) {
      debugPrint('Error fetching polygons: $e');
      return {};
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Google Map')),
      body: GoogleMap(
        polygons: polygons,
        initialCameraPosition: const CameraPosition(target: LatLng(39.3537502, 34.5992897), zoom: 4.5),
      ),
    );
  }
}

Screenshots or Video

Screenshots / Video demonstration

Image

  • With some polygon data it can also produce outputs like:
    Image

Logs

Logs 
flutter --version
Flutter 3.27.2 • channel stable • https://github.com/flutter/flutter.git
Framework • revision 68415ad1d9 (4 months ago) • 2025-01-13 10:22:03 -0800
Engine • revision e672b006cb
Tools • Dart 3.6.1 • DevTools 2.40.2

Flutter Doctor output

Doctor output 
[✓] Flutter (Channel stable, 3.27.2, on macOS 15.4.1 24E263 darwin-arm64 (Rosetta), locale tr-TR)
    • Flutter version 3.27.2 on channel stable at /Users/enescerrahoglu/development/flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 68415ad1d9 (4 months ago), 2025-01-13 10:22:03 -0800
    • Engine revision e672b006cb
    • Dart version 3.6.1
    • DevTools version 2.40.2

[✓] Android toolchain - develop for Android devices (Android SDK version 35.0.0)
    • Android SDK at /Users/enescerrahoglu/Library/Android/sdk
    • Platform android-35, build-tools 35.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 16.3)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Build 16E140
    • CocoaPods version 1.16.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.100.0)
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.110.0

[✓] Connected device (4 available)
    • Enes iPhone’u (mobile)          • 00008140-001044A62ED8801C • ios            • iOS 18.4.1 22E252
    • macOS (desktop)                 • macos                     • darwin-arm64   • macOS 15.4.1 24E263 darwin-arm64 (Rosetta)
    • Mac Designed for iPad (desktop) • mac-designed-for-ipad     • darwin         • macOS 15.4.1 24E263 darwin-arm64 (Rosetta)
    • Chrome (web)                    • chrome                    • web-javascript • Google Chrome 136.0.7103.93

[✓] Network resources
    • All expected network resources are available.

• No issues found!
@enescerrahoglu enescerrahoglu changed the title [google_maps_flutter] Polygon borders on the map are drawn incorrectly on a real iOS device. [google_maps_flutter] Polygon borders (stroke) on the map are drawn incorrectly on a real iOS device. May 12, 2025
@danagbemava-nc danagbemava-nc added the in triage Presently being triaged by the triage team label May 13, 2025
@danagbemava-nc
Copy link
Member

Hi @enescerrahoglu, please provide a complete minimal reproducible code sample so that we can properly investigate this.

Thank you

@danagbemava-nc danagbemava-nc added the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label May 13, 2025
@enescerrahoglu
Copy link
Author

enescerrahoglu commented May 13, 2025 •
edited
Loading

Hi @enescerrahoglu, please provide a complete minimal reproducible code sample so that we can properly investigate this.

Thank you

I've updated the Code Sample section, you can test it with the build there. Note that the problem only occurs on real iOS devices. Not in the simulators.

@github-actions github-actions bot removed the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label May 13, 2025
@danagbemava-nc danagbemava-nc changed the title [google_maps_flutter] Polygon borders (stroke) on the map are drawn incorrectly on a real iOS device. [google_maps_flutter][iOS] Polygon borders (stroke) on the map are drawn incorrectly May 14, 2025
@danagbemava-nc
Copy link
Member

Hi @enescerrahoglu, what version of iOS is your simulator running? I see the issue reproduce on my iOS 18.5 simulator. See the screenshot below

Image

@danagbemava-nc danagbemava-nc added the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label May 14, 2025
@enescerrahoglu
Copy link
Author

enescerrahoglu commented May 14, 2025 •
edited
Loading

Hi @danagbemava-nc,
iOS versions of the real devices I tested: iPhone 16 Pro (18.4), iPhone 16 Pro (18.5), iPhone SE 2 (18.4.1), iPhone 13 (18.4.1)
iOS version of the simulator I tested: iPhone 16 Pro (18.4)

@github-actions github-actions bot removed the waiting for customer response The Flutter team cannot make further progress on this issue until the original reporter responds label May 14, 2025
@danagbemava-nc
Copy link
Member

That is very interesting. I tested on another device and the issue reproduces on the simulator there as well (an iOS 18.4) simulator this time. I noticed your flutter doctor shows you're running in rosetta mode, so maybe that's why you don't see it on the simulator.

Nonetheless, this is yet another polygon related issue on iOS.
Similar issues are

flutter doctor -v 
[✓] Flutter (Channel stable, 3.29.3, on macOS 15.4 24E248 darwin-arm64, locale en-US) [1,835ms]
    • Flutter version 3.29.3 on channel stable at /Users/deanli/dev/stable
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision ea121f8859 (5 weeks ago), 2025-04-11 19:10:07 +0000
    • Engine revision cf56914b32
    • Dart version 3.7.2
    • DevTools version 2.42.3

[✓] Android toolchain - develop for Android devices (Android SDK version 36.0.0) [4.5s]
    • Android SDK at /Users/deanli/Library/Android/sdk
    • Platform android-36, build-tools 36.0.0
    • Java binary at: /Users/deanli/Applications/Android Studio Meerkat Feature Drop 2024.3.2 RC 4.app/Contents/jbr/Contents/Home/bin/java
      This JDK is specified in your Flutter configuration.
      To change the current JDK, run: `flutter config --jdk-dir="path/to/jdk"`.
    • Java version OpenJDK Runtime Environment (build 21.0.6+-13368085-b895.109)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 16.4) [2.1s]
    • Xcode at /Applications/Xcode-16.4.0-Beta.app/Contents/Developer
    • Build 16F1t
    • CocoaPods version 1.16.2

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

[✓] Android Studio (version 2024.3) [12ms]
    • Android Studio at /Users/deanli/Applications/Android Studio Meerkat Feature Drop 2024.3.2 RC 4.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
    • android-studio-dir = /Users/deanli/Applications/Android Studio Meerkat Feature Drop 2024.3.2 RC 4.app
    • Java version OpenJDK Runtime Environment (build 21.0.6+-13368085-b895.109)

[✓] Android Studio (version 2024.2) [10ms]
    • Android Studio at /Users/deanli/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 21.0.5+-12932927-b750.29)

[✓] VS Code (version 1.99.3) [10ms]
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.110.0

[✓] Connected device (7 available) [8.0s]
    • iPhone 16 Pro Max (wireless) (mobile) • 00008140-00194CC23A68801C            • ios            • iOS 18.5 22F76
    • Nexus (wireless) (mobile)             • 00008020-001875E83A38002E            • ios            • iOS 18.4.1 22E252
    • iPhone (wireless) (mobile)            • 00008030-0019281E01F8802E            • ios            • iOS 18.4.1 22E252
    • iPhone 16 Pro (mobile)                • 63C28242-27C4-477D-A63A-BC88BADB1BCA • ios            • com.apple.CoreSimulator.SimRuntime.iOS-18-5 (simulator)
    • macOS (desktop)                       • macos                                • darwin-arm64   • macOS 15.4 24E248 darwin-arm64
    • Mac Designed for iPad (desktop)       • mac-designed-for-ipad                • darwin         • macOS 15.4 24E248 darwin-arm64
    • Chrome (web)                          • chrome                               • web-javascript • Google Chrome 136.0.7103.94
    ! Error: Browsing on the local area network for Dean’s iPad. Ensure the device is unlocked and attached with a cable or associated with the same local area network as this Mac.
      The device must be opted into Developer Mode to connect wirelessly. (code -27)

[✓] Network resources [1,399ms]
    • All expected network resources are available.

• No issues found!

[!] Flutter (Channel master, 3.33.0-1.0.pre.85, on macOS 15.4 24E248 darwin-arm64, locale en-US) [2.8s]
    • Flutter version 3.33.0-1.0.pre.85 on channel master at /Users/deanli/dev/master
    ! Warning: `flutter` on your path resolves to /Users/deanli/dev/stable/bin/flutter, which is not inside your current Flutter SDK checkout at /Users/deanli/dev/master. Consider adding /Users/deanli/dev/master/bin to the front of your path.
    ! Warning: `dart` on your path resolves to /Users/deanli/dev/stable/bin/dart, which is not inside your current Flutter SDK checkout at /Users/deanli/dev/master. Consider adding /Users/deanli/dev/master/bin to the front of your path.
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 3cb2f5f6a5 (2 hours ago), 2025-05-15 07:17:23 +0200
    • Engine revision 3cb2f5f6a5
    • Dart version 3.9.0 (build 3.9.0-117.0.dev)
    • DevTools version 2.46.0
    • 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 36.0.0) [2.6s]
    • Android SDK at /Users/deanli/Library/Android/sdk
    • Emulator version 35.5.9.0 (build_id 13248646) (CL:N/A)
    • Platform android-36, build-tools 36.0.0
    • Java binary at: /Users/deanli/Applications/Android Studio Meerkat Feature Drop 2024.3.2 RC 4.app/Contents/jbr/Contents/Home/bin/java
      This JDK is specified in your Flutter configuration.
      To change the current JDK, run: `flutter config --jdk-dir="path/to/jdk"`.
    • Java version OpenJDK Runtime Environment (build 21.0.6+-13368085-b895.109)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 16.4) [1,817ms]
    • Xcode at /Applications/Xcode-16.4.0-Beta.app/Contents/Developer
    • Build 16F1t
    • CocoaPods version 1.16.2

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

[✓] Android Studio (version 2024.3) [9ms]
    • Android Studio at /Users/deanli/Applications/Android Studio Meerkat Feature Drop 2024.3.2 RC 4.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
    • android-studio-dir = /Users/deanli/Applications/Android Studio Meerkat Feature Drop 2024.3.2 RC 4.app
    • Java version OpenJDK Runtime Environment (build 21.0.6+-13368085-b895.109)

[✓] Android Studio (version 2024.2) [8ms]
    • Android Studio at /Users/deanli/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 21.0.5+-12932927-b750.29)

[✓] VS Code (version 1.99.3) [8ms]
    • VS Code at /Applications/Visual Studio Code.app/Contents
    • Flutter extension version 3.110.0

[✓] Connected device (6 available) [7.1s]
    • iPhone 16 Pro Max (wireless) (mobile) • 00008140-00194CC23A68801C            • ios            • iOS 18.5 22F76
    • Nexus (wireless) (mobile)             • 00008020-001875E83A38002E            • ios            • iOS 18.4.1 22E252
    • iPhone (wireless) (mobile)            • 00008030-0019281E01F8802E            • ios            • iOS 18.4.1 22E252
    • iPhone 16 Pro (mobile)                • 63C28242-27C4-477D-A63A-BC88BADB1BCA • ios            • com.apple.CoreSimulator.SimRuntime.iOS-18-5 (simulator)
    • macOS (desktop)                       • macos                                • darwin-arm64   • macOS 15.4 24E248 darwin-arm64
    • Chrome (web)                          • chrome                               • web-javascript • Google Chrome 136.0.7103.94
    ! Error: Browsing on the local area network for Dean’s iPad. Ensure the device is unlocked and attached with a cable or associated with the same local area network as this Mac.
      The device must be opted into Developer Mode to connect wirelessly. (code -27)

[✓] Network resources [792ms]
    • All expected network resources are available.

! Doctor found issues in 1 category.

``

</details>

@danagbemava-nc danagbemava-nc added platform-ios iOS applications specifically p: maps Google Maps plugin package flutter/packages repository. See also p: labels. has reproducible steps The issue has been confirmed reproducible and is ready to work on team-ios Owned by iOS platform team found in release: 3.29 Found to occur in 3.29 found in release: 3.33 Found to occur in 3.33 fyi-ecosystem For the attention of Ecosystem team and removed in triage Presently being triaged by the triage team labels May 15, 2025
@cbracken cbracken added P2 Important issues not at the top of the work list triaged-ios Triaged by iOS platform team labels May 22, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
found in release: 3.29 Found to occur in 3.29 found in release: 3.33 Found to occur in 3.33 fyi-ecosystem For the attention of Ecosystem team has reproducible steps The issue has been confirmed reproducible and is ready to work on p: maps Google Maps plugin P2 Important issues not at the top of the work list package flutter/packages repository. See also p: labels. platform-ios iOS applications specifically team-ios Owned by iOS platform team triaged-ios Triaged by iOS platform team
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@cbracken @enescerrahoglu @danagbemava-nc
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy