如何设置谷歌地图加载瓷砖颜色?

Question

在地图上以深色风格明亮加载图块看起来不太好。有没有办法改变加载瓷砖的颜色？

Answer 1

你可以用GoogleMap.setMapStyle来改变地图的主题，试试这样，

try {
// Customise the styling of the base map using a JSON object defined
// in a raw resource file.
boolean success = googleMap.setMapStyle(
MapStyleOptions.loadRawResourceStyle(
this, R.raw.style_json));
if (!success) {
Log.e(TAG, "Style parsing failed.");
}
} catch (Resources.NotFoundException e) {
Log.e(TAG, "Can't find style. Error: ", e);
}

您可以从此官方地图样式站点获取 json 文件，并且可以将该 json 文件放入您的应用程序原始文件夹中

在Android中设置地图样式的完整说明，您可以在官方网站上参考

样品style_json

[
{
"elementType": "geometry",
"stylers": [
{
"color": "#212121"
}
]
},
{
"elementType": "labels.text.fill",
"stylers": [
{
"color": "#757575"
}
]
},
{
"elementType": "labels.text.stroke",
"stylers": [
{
"color": "#212121"
}
]
},
{
"featureType": "administrative.country",
"elementType": "labels.text.fill",
"stylers": [
{
"color": "#9e9e9e"
}
]
},
{
"featureType": "administrative.locality",
"elementType": "labels.text.fill",
"stylers": [
{
"color": "#bdbdbd"
}
]
},
{
"featureType": "poi",
"elementType": "labels.text.fill",
"stylers": [
{
"color": "#757575"
}
]
},
{
"featureType": "poi.park",
"elementType": "geometry",
"stylers": [
{
"color": "#181818"
}
]
},
{
"featureType": "poi.park",
"elementType": "labels.text.fill",
"stylers": [
{
"color": "#616161"
}
]
},
{
"featureType": "poi.park",
"elementType": "labels.text.stroke",
"stylers": [
{
"color": "#1b1b1b"
}
]
},
{
"featureType": "road",
"elementType": "geometry.fill",
"stylers": [
{
"color": "#2c2c2c"
}
]
},
{
"featureType": "road",
"elementType": "labels.text.fill",
"stylers": [
{
"color": "#8a8a8a"
}
]
},
{
"featureType": "road.arterial",
"elementType": "geometry",
"stylers": [
{
"color": "#373737"
}
]
},
{
"featureType": "road.highway",
"elementType": "geometry",
"stylers": [
{
"color": "#3c3c3c"
}
]
},
{
"featureType": "road.highway.controlled_access",
"elementType": "geometry",
"stylers": [
{
"color": "#4e4e4e"
}
]
},
{
"featureType": "road.local",
"elementType": "labels.text.fill",
"stylers": [
{
"color": "#616161"
}
]
},
{
"featureType": "transit",
"elementType": "labels.text.fill",
"stylers": [
{
"color": "#757575"
}
]
},
{
"featureType": "water",
"elementType": "geometry",
"stylers": [
{
"color": "#000000"
}
]
},
{
"featureType": "water",
"elementType": "labels.text.fill",
"stylers": [
{
"color": "#3d3d3d"
}
]
}
]

Answer 2

我面临着同样的头痛，通过片段 XML res设法解决了它：

<fragment
android:id="@+id/fragment_google_map"
class="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:backgroundColor="@color/primaryBlue"/>

Answer 3

概念：

图块是一个矩形，用于保存图像数据。Tile(链接)由TileProvider(链接)提供。TileProvider是一个为TileOverlay(链接)提供磁贴图像的类。

注： 叠加本质上是透明的，具有 x、y 和 z 轴。它就像你面前的透明玻璃。

TileProvider在TileOverlay后面提供Tile，就像您将书放在透明玻璃下方一样。在TileOverlay的 z 轴上，有一组层，如GroundOverlays、Circles、Polylines和Polygons。这意味着GroundOverlays在最后一层，而且是最不透明的。您提供自定义图像并在GroundOverlay中更改颜色。您还可以保留所有其他顶层的透明度、可见性等属性。通过这种方式，您可以更改磁贴颜色。

现在，您的主要任务是创建自定义的地面覆盖层。您GroundOverlay图像以BitmapDescriptor形式提供。您可以使用BitmapDescriptorFactory创建自定义BitmapDescriptor映像，如下所示。

BitmapDescriptor icon = BitmapDescriptorFactory.fromResource(R.drawable.current_position_tennis_ball) 

/* 你看，current_position_tennis_ball drawable resource，现在，你用了你的Tile颜色 */

实现：

注意：MOON_MAP_URL_FORMAT是enter code herejpg 图像，tileProvider引用该图像(实际上是自定义图像)

private static final String MOON_MAP_URL_FORMAT =
"http://mw1.google.com/mw-planetary/lunar/lunarmaps_v1/clem_bw/%d/%d/%d.jpg";

/* 提供上面的明亮 JPG */

TileProvider tileProvider /* ultimately it is an image */ = new UrlTileProvider(256, 256) {
@Override
public synchronized URL getTileUrl(int x, int y, int zoom) {
// The moon tile coordinate system is reversed.  This is not normal.
int reversedY = (1 << zoom) - y - 1;
String s = String.format(Locale.US, MOON_MAP_URL_FORMAT, zoom, x, reversedY);
URL url = null;
try {
url = new URL(s);
} catch (MalformedURLException e) {
throw new AssertionError(e);
}
return url;
}
};

您可以在此处查看完整的源代码。

Answer 4

试试这个

map = new GMap2(document.getElementById("map"), { backgroundColor: "#000000" });

Answer 5

您在评论中说"我正在为 android 编写本机应用程序"，但这并未反映在您的标签(android、google-maps)或标题或问题中。
如果您使用的是 Ionic 原生 4.0 框架 ionicframework，那么：

setBackgroundColor(color); //Specifies the background color of the app.

Answer 6

创建mapLabelStyle.json到您的应用程序中raw folder。将此 json 样式复制到该文件中。

[
{
"elementType": "labels",
"stylers": [
{
"lightness": 5
},
{
"visibility": "simplified"
}
]
},
{
"elementType": "labels.text",
"stylers": [
{
"color": "#400040"           //You can change color of your choice
}
]
}
]

然后使用以下代码设置样式。

GoogleMap.setMapStyle(MapStyleOptions.loadRawResourceStyle(this,R.raw.mapLabelStyle));