如何在颤振中与谷歌地图集成？

Posted 2023-02-23

【中文标题】如何在颤振中与谷歌地图集成？

【英文标题】：How to integrate with google maps in flutter?

【发布时间】：2019-06-10 23:35:00

【问题描述】：

我开始使用 Flutter 进行开发，我想使用 google_maps_flutter 包。

为了将地图添加到我的应用程序 (https://medium.com/flutter-io/google-maps-and-flutter-cfb330f9a245)，我正在浏览中等帖子。

我在 AppDelegate.m 中添加了这段代码

#include "AppDelegate.h"
#include "GeneratedPluginRegistrant.h"
#import "GoogleMaps/GoogleMaps.h"

@implementation AppDelegate

- (BOOL)application:(UIApplication *)application
    didFinishLaunchingWithOptions:(NSDictionary *)launchOptions 
  [GMSServices provideAPIKey:@"******"];
  [GeneratedPluginRegistrant registerWithRegistry:self];
  return [super application:application didFinishLaunchingWithOptions:launchOptions];

@end

这个到 Info.plist

<key>io.flutter.embedded_views_preview</key>
<true/>

这是小部件代码：

import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';

void main() => runApp(MyApp());

class MyApp extends StatefulWidget 
  @override
  _MyAppState createState() => _MyAppState();


class _MyAppState extends State<MyApp> 
  GoogleMapController mapController;

  final LatLng _center = const LatLng(45.521563, -122.677433);

  void _onMapCreated(GoogleMapController controller) 
    mapController = controller;
  

  @override
  Widget build(BuildContext context) 
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text('Maps Sample App'),
          backgroundColor: Colors.green[700],
        ),
        body: GoogleMap(
          onMapCreated: _onMapCreated,
          options: GoogleMapOptions(
            cameraPosition: CameraPosition(
              target: _center,
              zoom: 11.0,
            ),
          ),
        ),
      ),
    );
  

作为帖子中的示例，但不幸的是，我得到了一个带有谷歌地图小部件的屏幕，但没有显示地图。像这样：https://i.imgur.com/HGam5ac.jpg（我不能上传图片，因为声誉低，对不起:()。

sdk有问题吗？还是代码有什么要改的？

感谢您的帮助！！

【问题讨论】：

我没有检查代码，但从图像来看，它看起来像是 Google Maps API 密钥的错误......通常当它发生时，它会在调试中打印错误。您没有收到任何错误吗？

谢谢！我更改了一个 api 密钥，它可以工作！我不知道为什么颤振不会抛出任何错误......

你在使用flutter run吗？我认为如果你使用 android Studio 构建它会附加一个调试器并抛出错误。

我正在使用带有调试器的 VS Code，它没有抛出错误

你激活SDK for maps in ios了吗？

【参考方案1】：

我遇到了同样的问题，并花了一些时间解决它。

请注意，不建议取消对 API 密钥的限制，应作为临时解决方案。

首先，如果您尚未在 Google Cloud Platform 帐户中启用结算功能，则无法使用 Google Maps API。

我通过确保我的 API 密钥不受限制来解决此问题。 我删除了以前的 API 密钥并创建了一个新的 API 密钥，但这次我没有限制 API 密钥。

之后地图正确加载。

如果您打算使用地理定位服务，将以下代码添加到您的ios/Runner/Info.plist 文件可能会有所帮助

<key>NSLocationWhenInUseUsageDescription</key>
<string>Reason for requesting location permission</string>

如果您不知道如何创建 API 密钥，请点击此链接 Get API Key.

这就是我的 API 密钥配置的样子

这就是我的应用中的地图页面的样子