文章/答案/技术大牛

发布

社区首页 >问答首页 >定制谷歌地图的landscape.man_made颜色和保持阴影？

问定制谷歌地图的landscape.man_made颜色和保持阴影？
EN

Stack Overflow用户

提问于 2013-10-14 10:17:15

回答 1查看 3.9K关注 0票数 3

我正在尝试使用APIv3.exp构建一个定制的google地图。我也想定制建筑物的颜色，但是如果我改变了landscape.man_made的颜色，我就会失去建筑物中美丽的阴影效果(不同的色调)。

默认颜色定制颜色

用于StyledMapType对象的json是

var mapStyle = [{
  "featureType": "landscape.man_made",
  "elementType": "geometry.fill",
  "stylers": [{
     "color": "#808080"
  }]
}];

是否有可能改变建筑物的颜色和保持阴影的效果？

google-maps

google-maps-api-3

google-maps-styled

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-10-14 22:31:35

是。这是有可能的。简单地使用色调和饱和度

{ stylers: [ { hue: "#00ffe6" }, { saturation: -20 } ] }

更详细的示例可以在这里找到https://developers.google.com/maps/documentation/javascript/styling。

下面是我的google地图样式和完整代码的示例

var map;
function initialize() {
    var lat="53.89076";
    var long="27.57156";
    var myLatLng=new google.maps.LatLng(lat, long);
    var mapOptions = {
        zoom: 17,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        center: myLatLng,
        styles: [
            { "stylers": [ { "hue": "#3d535b" }, { "saturation": -20 } ] },
            { "elementType": "labels.text.fill", "stylers": [ { "color": "#3d535b" } ] },
            { "elementType": "labels.text.stroke", "stylers": [ { "color": "##e8eeef" } ] },
            { "featureType": "road", "elementType": "geometry.fill", "stylers": [ { "color": "#e8eeef" } ] },
            { "featureType": "road", "elementType": "geometry.stroke", "stylers": [ { "color": "#b1bcbf" } ] },
            { "featureType": "water", "stylers": [ { "color": "#adb9bc" } ] },
            { "featureType": "water", "elementType": "labels.text.fill", "stylers": [ { "color": "#3d535b" } ] },
            { "featureType": "water", "elementType": "labels.text.stroke", "stylers": [ { "color": "#d1d9db" } ] },
            { "featureType": "poi", "elementType": "geometry", "stylers": [ { "visibility": "off" } ] },
            { "featureType": "poi.park", "elementType": "geometry", "stylers": [ { "color": "#bfc9cc" }, { "visibility": "on" } ] },
            { "featureType": "poi.business", "elementType": "geometry", "stylers": [ { "color": "#cdd6d8" }, { "visibility": "on" } ] },
            { "featureType": "poi.school", "elementType": "geometry", "stylers": [ { "color": "#cdd6d8" }, { "visibility": "on" } ] },
            { "featureType": "poi.medical", "elementType": "geometry", "stylers": [ { "color": "#cdd6d8" }, { "visibility": "on" } ] },
            { "featureType": "poi.government", "elementType": "geometry", "stylers": [ { "color": "#cdd6d8" }, { "visibility": "on" } ] },
            { "featureType": "landscape.natural", "elementType": "geometry", "stylers": [ { "color": "#dee5e8" } ] }
        ]
    };

    map = new google.maps.Map(document.getElementById('map'), mapOptions);

    var iconBase = 'images/pin.png';

    var marker = new google.maps.Marker({
        position: myLatLng,
        map: map,
        icon:iconBase,
        title: 'Moby Dick'
    });

    marker.setMap(map);       

}

google.maps.event.addDomListener(window, 'load', initialize);

google.maps.event.addDomListener(window, "resize", function() {
    var center = map.getCenter();
    google.maps.event.trigger(map, "resize");
    map.setCenter(center); 
});

票数 3

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/19358022

复制

相似问题

问定制谷歌地图的landscape.man_made颜色和保持阴影？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问定制谷歌地图的landscape.man_made颜色和保持阴影？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问定制谷歌地图的landscape.man_made颜色和保持阴影？
EN