风格谷歌地图

时间:2013-10-24 13:00:27

标签: javascript google-maps google-maps-api-3 maps

我能够完美地设计地图样式,使其去饱和。我也可以设置地图样式,使其具有自定义标记。但是,我无法将代码组合在一起,以使自定义标记生成去饱和地图。有人可以看看我的脚本,并检查我在正确的位置有正确的位。感谢您的帮助 - 非常感谢:

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>

<script>
var map;
var brooklyn = new google.maps.LatLng(53.798709, -1.550740); 

var MY_MAPTYPE_ID = 'custom_style';

function initialize() {

var mapOptions = {
zoom: 14,
center: new google.maps.LatLng(53.798709, -1.550740),
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById('map-canvas'),
                            mapOptions);

var image = 'images/marker.png';
var myLatLng = new google.maps.LatLng(53.798709, -1.550740);
var beachMarker = new google.maps.Marker({
  position: myLatLng,
  map: map,
  icon: image
});

var featureOpts = [
{
  stylers: [

    ]
},{
        featureType: "all",

        stylers: [{
            saturation: -100
        }]},

   {

    }]

    }

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

</script>

1 个答案:

答案 0 :(得分:0)

你忘记了应用这种风格。

将此行放在initialize()

的末尾
map.setOptions({styles:featureOpts});

或使用mapOptions定义样式:

var mapOptions = {
  zoom:       14,
  center:     new google.maps.LatLng(53.798709, -1.550740),
  mapTypeId:  google.maps.MapTypeId.ROADMAP,
  styles:     [
                {
                  featureType: "all",
                  stylers: [
                            {
                              saturation: -100
                            }
                           ]
                }
              ]
};
相关问题