首页 > 解决方案 > Flutter iOS Map 样式未应用

问题描述

我想在我的颤动地图中隐藏地图上的所有地标和其他指标。我已经为谷歌地图包(google_maps_flutter)实现了地图样式。这种风格在 Android 上显示得很好,但在 iOS 上却不行。地图没有错误消息或任何异常。我希望能深入了解为什么会这样。我有最新版本的插件 1.0.3。下面是我的风格和 Flutter 医生的输出。

颤振风格

[
  {
    "featureType": "administrative",
    "elementType": "geometry",
    "stylers": [
      {
        "visibility": "off"
      }
    ]
  },
  {
    "featureType": "poi",
    "stylers": [
      {
        "visibility": "off"
      }
    ]
  },
  {
    "featureType": "road",
    "elementType": "labels.icon",
    "stylers": [
      {
        "visibility": "off"
      }
    ]
  },
  {
    "featureType": "transit",
    "stylers": [
      {
        "visibility": "off"
      }
    ]
  }
]

这是我的颤振医生

[✓] Flutter (Channel stable, 1.22.0, on Mac OS X 10.15.6 19G2021, locale en-ZA)
• Flutter version 1.22.0 at /Users/danemackier/flutter
• Framework revision d408d302e2 (4 weeks ago), 2020-09-29 11:49:17 -0700
• Engine revision 5babba6c4d
• Dart version 2.10.0



[✓] Android toolchain - develop for Android devices (Android SDK version 29.0.2)
    • Android SDK at /Users/danemackier/Library/Android/sdk
    • Platform android-29, build-tools 29.0.2
    • Java binary at: /Applications/Android Studio.app/Contents/jre/jdk/Contents/Home/bin/java
    • Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)
    • All Android licenses accepted.

[✓] Xcode - develop for iOS and macOS (Xcode 12.0.1)
    • Xcode at /Applications/Xcode.app/Contents/Developer
    • Xcode 12.0.1, Build version 12A7300
    • CocoaPods version 1.9.1

[✓] Android Studio (version 3.5)
    • Android Studio at /Applications/Android Studio.app/Contents
    • Flutter plugin version 44.0.1
    • Dart plugin version 191.8593
    • Java version OpenJDK Runtime Environment (build 1.8.0_202-release-1483-b49-5587405)

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

[✓] Connected device (1 available)
    • iPhone 11 Pro Max (mobile) • 400921E6-429C-44D7-B113-F979A171C48A • ios •
      com.apple.CoreSimulator.SimRuntime.iOS-14-0 (simulator)

• No issues found!

标签: fluttergoogle-mapsdartflutter-dependencies

解决方案


如果您尝试获取没有地标符号的地图:

  1. 使用https://mapstyle.withgoogle.com/您可以使用 Web UI 设置地图样式并查看地图中的最终样式。如果滚动,您会看到一个 FINISH 按钮,然后会出现一个对话框,您可以在其中复制 JSON

  2. 然后只需将该 json 粘贴到您的 Flutter 应用程序资产中的 .txt 文件中

    例如 assets/map_style.txt

  3. 将 GoogleMap 放在有状态的小部件中

宣布:

String _mapStyle
GoogleMapController controller;

然后在初始化状态:

@override
 void initState() {
    rootBundle.loadString('assets/map_style.txt').then((string) {
      _mapStyle = string;
    });
    super.initState();
 }

void _onMapCreated(GoogleMapController controller) {
    this.controller = controller;
    controller.setMapStyle(_mapStyle);
}

_onMapCreated 在参数 onMapCreated 中分配给 GoogleMap 小部件


推荐阅读