如何解决Google Maps Flutter setMapStyle无效-城市名称仍显示
我在使Google Maps样式在Android上的Flutter应用程序中工作时遇到问题。我正在使用google_maps_flutter
插件version 0.5.30
。我通过从Google Maps Styling wizard获得样式JSON
,方法是将转盘设置为最左端,从而取消了所有标签,道路和地标,并从中提取了JSON。我正在从小部件的initState()
方法中的资产文件中加载该资源,而在onMapCreated方法中,使用已加载的JSON调用mapController.setMapStyle
。通话成功,但地图仍显示城市名称。
我尝试过在setMapStyle调用之后调用setState,而不是将setMapStyle()调用放入setState((){..})内,但这也不起作用。
以下是指向Google Maps Styling向导的链接,其中相同的JSON不显示城市或标签。 https://1drv.ms/u/s!AoeWKBC0aN0DhoA8qIr3SehO1o4UhQ
以下是指向我的Android平板电脑上的屏幕快照的链接,该屏幕上部署了应用程序,并显示了地图(使用相同的JSON
使用mapStyle),但显示了城市和省份名称。
https://1drv.ms/u/s!AoeWKBC0aN0DhoA7MOALo0w7NWixuA?e=BKw9fu
import 'dart:developer';
import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Google Maps',theme: ThemeData(
primarySwatch: Colors.blue,),home: MyHomePage(title: 'Flutter Google MapsPage'),);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key,this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
GoogleMapController mapController;
String mapStyle;
// following are lat/long of Anantapur which is roughly at the
// center of South India
final LatLng center = const LatLng(14.68,77.6);
double INITIAL_ZOOM=6.0;
@override
void initState() {
super.initState();
//loading map style JSON from asset file
DefaultAssetBundle.of(context).loadString('assets/googleMapStyle1.json').then((string) {
this.mapStyle = string;
}).catchError((error) {
log(error.toString());
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
// Here we take the value from the MyHomePage object that was created by
// the App.build method,and use it to set our appbar title.
title: Text(widget.title),body: Center(
// Center is a layout widget. It takes a single child and positions it
// in the middle of the parent.
child: Column(
children: <Widget>[
Expanded(
child: GoogleMap(
onMapCreated: mapCreated,mapType: MapType.terrain,initialCameraPosition: CameraPosition(
target: center,zoom: INITIAL_ZOOM,)
)
)
],));
}
void mapCreated(GoogleMapController controller) {
//set style on the map on creation to customize look showing only map features
//we want to show.
log(this.mapStyle);
setState(() {
this.mapController = controller;
if (mapStyle != null) {
this.mapController.setMapStyle(this.mapStyle).
then((value) {
log("Map Style set");
}).catchError((error) =>
log("Error setting map style:" + error.toString()));
}
else {
log(
"GoogleMapView:_onMapCreated: Map style could not be loaded.");
}
});
}
}
以下是assets / googleMapStyle1.json中的JSON:
[
{
"elementType": "labels","stylers": [
{
"visibility": "off"
}
]
},{
"featureType": "administrative","elementType": "geometry",{
"featureType": "administrative.land_parcel",{
"featureType": "administrative.neighborhood",{
"featureType": "poi",{
"featureType": "road","elementType": "labels.icon",{
"featureType": "transit","stylers": [
{
"visibility": "off"
}
]
}
]
以下是我的pubspec.yaml:
name: googlemapsstyling
description: Google Maps Flutter styling issuue
# The following line prevents the package from being accidentally published to
# pub.dev using `pub publish`. This is preferred for private packages.
publish_to: 'none' # Remove this line if you wish to publish to pub.dev
version: 1.0.0+1
environment:
sdk: ">=2.7.0 <3.0.0"
dependencies:
flutter:
sdk: flutter
google_maps_flutter: ^0.5.30
cupertino_icons: ^0.1.3
dev_dependencies:
flutter_test:
sdk: flutter
# The following section is specific to Flutter.
flutter:
uses-material-design: true
# To add assets to your application,add an assets section,like this:
assets:
- assets/googleMapStyle1.json
任何指向我做错事情的指针还是这是一个错误?
解决方法
描述自定义地图样式后,mapType: MapType.terrain,
将覆盖GoogleMap
小部件中的自定义主题。
更新后的代码在下面,或者仅注释掉或删除maptype:
行。
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
// Here we take the value from the MyHomePage object that was created by
// the App.build method,and use it to set our appbar title.
title: Text(widget.title),),body: Center(
// Center is a layout widget. It takes a single child and positions it
// in the middle of the parent.
child: Column(
children: <Widget>[
Expanded(
child: GoogleMap(
onMapCreated: mapCreated,//mapType: MapType.terrain,//This was causing the problem
initialCameraPosition: CameraPosition(
target: center,zoom: _initialZoom,)
)
)
],));
}
,
我不确定这是否行得通,但您可以尝试运行此
//loading map style JSON from asset file
DefaultAssetBundle.of(context).loadString('assets/googleMapStyle1.json').then((string) {
this.mapStyle = string;
}).catchError((error) {
log(error.toString());
});
mapCreated
中的可能是上下文更改的问题
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。