Skip to content

Commit 3c3c980

Browse files
ditmanditman
authored
[google_maps] Endorses package:google_maps_flutter_web. (flutter#4124)
This PR endorses `package:google_maps_flutter_web` as the implementation of `google_maps_flutter` for the web platform, and updates the relevant documentation. ### Issues * Fixes flutter#80688
1 parent 81e3428 commit 3c3c980

File tree

14 files changed

+165
-14
lines changed

14 files changed

+165
-14
lines changed

‎packages/google_maps_flutter/google_maps_flutter/CHANGELOG.md‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,8 @@
1+
## 2.3.0
2+
3+
* Endorses [`google_maps_flutter_web`](https://pub.dev/packages/google_maps_flutter_web)
4+
as the web implementation of this plugin.
5+
16
## 2.2.8
27

38
* Fixes unawaited_futures violations.

‎packages/google_maps_flutter/google_maps_flutter/README.md‎

Lines changed: 16 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,11 @@
66

77
A Flutter plugin that provides a [Google Maps](https://developers.google.com/maps/) widget.
88

9-
| | Android | iOS |
10-
|-------------|---------|---------|
11-
| **Support** | SDK 20+ | iOS 11+ |
9+
| | Android | iOS | Web |
10+
|-------------|---------|---------|----------------------------------|
11+
| **Support** | SDK 20+ | iOS 11+ | Same as [Flutter's][web-support] |
12+
13+
[web-support]: https://docs.flutter.dev/reference/supported-platforms
1214

1315
## Usage
1416

@@ -25,6 +27,7 @@ To use this plugin, add `google_maps_flutter` as a [dependency in your pubspec.y
2527
* Select "APIs" under the Google Maps menu.
2628
* To enable Google Maps for Android, select "Maps SDK for Android" in the "Additional APIs" section, then select "ENABLE".
2729
* To enable Google Maps for iOS, select "Maps SDK for iOS" in the "Additional APIs" section, then select "ENABLE".
30+
* To enable Google Maps for Web, enable the "Maps JavaScript API".
2831
* Make sure the APIs you enabled are under the "Enabled APIs" section.
2932

3033
For more details, see [Getting started with Google Maps Platform](https://developers.google.com/maps/gmp-get-started).
@@ -98,7 +101,16 @@ import GoogleMaps
98101
}
99102
```
100103

101-
### Both
104+
### Web
105+
106+
You'll need to modify the `web/index.html` file of your Flutter Web application
107+
to include the Google Maps JS SDK.
108+
109+
Check [the `google_maps_flutter_web` README](https://pub.dev/packages/google_maps_flutter_web)
110+
for the latest information on how to prepare your App to use Google Maps on the
111+
web.
112+
113+
### All
102114

103115
You can now add a `GoogleMap` widget to your widget tree.
104116

‎packages/google_maps_flutter/google_maps_flutter/example/web/favicon.png‎

917 Bytes
Loading

‎packages/google_maps_flutter/google_maps_flutter/example/web/icons/Icon-192.png‎

5.17 KB
Loading

‎packages/google_maps_flutter/google_maps_flutter/example/web/icons/Icon-512.png‎

8.06 KB
Loading

‎packages/google_maps_flutter/google_maps_flutter/example/web/icons/Icon-maskable-192.png‎

5.46 KB
Loading

‎packages/google_maps_flutter/google_maps_flutter/example/web/icons/Icon-maskable-512.png‎

20.5 KB
Loading

‎packages/google_maps_flutter/google_maps_flutter/example/web/index.html‎

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
<!DOCTYPE html>
2+
<!-- Copyright 2013 The Flutter Authors. All rights reserved.
3+
Use of this source code is governed by a BSD-style license that can be
4+
found in the LICENSE file. -->
5+
<html>
6+
<head>
7+
<!--
8+
If you are serving your web app in a path other than the root, change the
9+
href value below to reflect the base path you are serving from.
10+
11+
The path provided below has to start and end with a slash "/" in order for
12+
it to work correctly.
13+
14+
For more details:
15+
* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base
16+
17+
This is a placeholder for base href that will be replaced by the value of
18+
the `--base-href` argument provided to `flutter build`.
19+
-->
20+
<base href="$FLUTTER_BASE_HREF">
21+
22+
<meta charset="UTF-8">
23+
<meta content="IE=Edge" http-equiv="X-UA-Compatible">
24+
<meta name="description" content="A new Flutter project.">
25+
26+
<!-- iOS meta tags & icons -->
27+
<meta name="apple-mobile-web-app-capable" content="yes">
28+
<meta name="apple-mobile-web-app-status-bar-style" content="black">
29+
<meta name="apple-mobile-web-app-title" content="example">
30+
<link rel="apple-touch-icon" href="icons/Icon-192.png">
31+
32+
<!-- Favicon -->
33+
<link rel="icon" type="image/png" href="favicon.png"/>
34+
35+
<title>Google Maps Web Example</title>
36+
37+
<link rel="manifest" href="manifest.json">
38+
39+
<!-- This API key comes from: go/flutter-maps-web-tests-api-key (GCP project: flutter-infra) -->
40+
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAa9cRBkhuxGq3Xw3HPz8SPwaVOhRmm7kk&libraries=geometry"></script>
41+
42+
<script>
43+
// The value below is injected by flutter build, do not touch.
44+
const serviceWorkerVersion = null;
45+
</script>
46+
<!-- This script adds the flutter initialization JS code -->
47+
<script src="flutter.js" defer></script>
48+
</head>
49+
<body>
50+
<script>
51+
window.addEventListener('load', function(ev) {
52+
// Download main.dart.js
53+
_flutter.loader.loadEntrypoint({
54+
serviceWorker: {
55+
serviceWorkerVersion: serviceWorkerVersion,
56+
},
57+
onEntrypointLoaded: function(engineInitializer) {
58+
engineInitializer.initializeEngine().then(function(appRunner) {
59+
appRunner.runApp();
60+
});
61+
}
62+
});
63+
});
64+
</script>
65+
</body>
66+
</html>

‎packages/google_maps_flutter/google_maps_flutter/example/web/manifest.json‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
{
2+
"name": "example",
3+
"short_name": "example",
4+
"start_url": ".",
5+
"display": "standalone",
6+
"background_color": "#0175C2",
7+
"theme_color": "#0175C2",
8+
"description": "A new Flutter project.",
9+
"orientation": "portrait-primary",
10+
"prefer_related_applications": false,
11+
"icons": [
12+
{
13+
"src": "icons/Icon-192.png",
14+
"sizes": "192x192",
15+
"type": "image/png"
16+
},
17+
{
18+
"src": "icons/Icon-512.png",
19+
"sizes": "512x512",
20+
"type": "image/png"
21+
},
22+
{
23+
"src": "icons/Icon-maskable-192.png",
24+
"sizes": "192x192",
25+
"type": "image/png",
26+
"purpose": "maskable"
27+
},
28+
{
29+
"src": "icons/Icon-maskable-512.png",
30+
"sizes": "512x512",
31+
"type": "image/png",
32+
"purpose": "maskable"
33+
}
34+
]
35+
}

‎packages/google_maps_flutter/google_maps_flutter/pubspec.yaml‎

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ name: google_maps_flutter
22
description: A Flutter plugin for integrating Google Maps in iOS and Android applications.
33
repository: https://github.com/flutter/packages/tree/main/packages/google_maps_flutter/google_maps_flutter
44
issue_tracker: https://github.com/flutter/flutter/issues?q=is%3Aissue+is%3Aopen+label%3A%22p%3A+maps%22
5-
version: 2.2.8
5+
version: 2.3.0
66

77
environment:
88
sdk: ">=2.18.0 <4.0.0"
@@ -15,16 +15,23 @@ flutter:
1515
default_package: google_maps_flutter_android
1616
ios:
1717
default_package: google_maps_flutter_ios
18+
web:
19+
default_package: google_maps_flutter_web
1820

1921
dependencies:
2022
flutter:
2123
sdk: flutter
2224
google_maps_flutter_android: ^2.1.10
2325
google_maps_flutter_ios: ^2.1.10
2426
google_maps_flutter_platform_interface: ^2.2.1
27+
google_maps_flutter_web: ^0.5.0
2528

2629
dev_dependencies:
2730
flutter_test:
2831
sdk: flutter
2932
plugin_platform_interface: ^2.0.0
3033
stream_transform: ^2.0.0
34+
35+
# The example deliberately includes limited-use secrets.
36+
false_secrets:
37+
- /example/web/index.html

0 commit comments

Comments
 (0)