如何在Android中更改Google地图的颜色

3

我想要将谷歌地图的颜色从白色改为黑色,但是找不到一个好的解决方案。我尝试使用相对布局来覆盖它,但这样会隐藏部分内容,不能改变GoogleMap的颜色。

            <fragment xmlns:android="http://schemas.android.com/apk/res/android"
                android:id="@+id/map"
                class="com.google.android.gms.maps.MapFragment"
                android:layout_width="match_parent"
                android:layout_height="100dp" />

你想要改变哪种颜色? - Ravi Jaggarapu
你可能想查看这个线程 - gerardnimo
请不要在问题标题中添加“已解决:”。您可以通过接受答案来表明您的问题已得到解决。 - double-beep
3个回答

5

请前往https://mapstyle.withgoogle.com/
选择您喜欢的地图风格,并获取对应的JSON数据,将其复制。
然后在您的Android地图项目资源中,点击“新建文件”,添加JSON文件并将风格JSON值粘贴进去,例如命名为"style_map.json"。最后,在您的地图活动中的onMapReady(GoogleMap googleMap)方法中做如下操作:

mGoogleMap = googleMap;
MapStyleOptions mapStyleOptions = MapStyleOptions.loadRawResourceStyle(this, R.raw.style_json);
mGoogleMap.setMapStyle(mapStyleOptions);

这对我有用 :)


我该如何获取R.raw.style_json? - sushant singh

0

我通过在WebView中运行Google地图的Html文件并将该html文件放入资产文件夹中来解决了这个问题。我使用以下代码进行显示:

<!DOCTYPE html>
<html>
<head>
<title>Panoramio Layer</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<style>
    html, body, #map-canvas {
    height: 100%;
    margin: 0px;
    padding: 0px
    }
    #panel {
    position: absolute;
    top: 5px;
    left: 50%;
    margin-left: -180px;
    z-index: 5;
    background-color: #fff;
    padding: 5px;
    border: 1px solid #999;
    }
    #photo-panel {
    background: #fff;
    padding: 5px;
    overflow-y: auto;
    overflow-x: hidden;
    width: 300px;
    max-height: 300px;
    font-size: 14px;
    font-family: Arial;
    border: 1px solid #ccc;
    box-shadow: -2px 2px 2px rgba(33, 33, 33, 0.4);
    display: none;
    }
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=panoramio"></script>
<script>
function initializeGmaps() {
var LatLng = {lat: 28.596979, lng: 77.326742};
var mapCanvas = document.getElementById('google-map');
var mapOptions = {
center : LatLng,
scrollwheel : false,
zoom : 14,
mapTypeId : google.maps.MapTypeId.ROADMAP,
backgroundColor: 'none',
styles : [{
stylers: [
{ invert_lightness: true },
{ hue: '#666' },
{ saturation: -100 },
{ lightness: -0 },
{ visibility: 'simplified' }
]
}]
}
var map = new google.maps.Map(mapCanvas, mapOptions);
var marker = new google.maps.Marker({
position: LatLng,
map: map,
icon: '<?=base_url();?>images/marker.png',
title: 'Advisorymandi.com Pvt. Ltd.'
});
}
google.maps.event.addDomListener(window, 'load', initializeGmaps);

</script>
</head>
<body>
<ul id="photo-panel">
<li><strong>Photos clicked</strong></li>
</ul>
<div id="google-map" class="youplay-gmaps" style=" height: 450px; width: 100%;"></div>
</body>
</html>

-1

为此,您需要使用Google地图v3库。请参见文档


为什么它没有简单易行的步骤来实现呢? - Anshul Tyagi
你错了!那是Android代码,而你谈论的是完全不同的Javascript API。 - Marius Kaunietis
是的。这与Android无关。 - Anshul Tyagi
安卓没有自定义地图视图的API。您应该使用JavaScript来自定义地图。 - AndroidLad
那是JavaScript API,而不是Android实现。 - toidiu

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接