1

我尝试使用多个标记制作谷歌地图,它在不应用谷歌地图样式的情况下工作,但是当我将背景设置为灰度时,它似乎没有显示地图。我想保持标记颜色,所以 CSS 样式不是一个选项。代码如下

function initialize() {

  // Create an array of styles.
  var styles = [
    {
      stylers: [

        { saturation: -20 }
      ]
    }
  ];

 var styledMap = new google.maps.StyledMapType(styles,
    {name: "Styled Map"});

    var locations = [
      ['United States', 38.976492, -103.875732, 3],
      ['Europe', 54.747569, 112.421105,346.289063, 3]

    ];

var map = new google.maps.Map(document.getElementById('map_canvas'), {
      zoom: 3,
      center: new google.maps.LatLng(45.92, 1.25),
      mapTypeId: [google.maps.MapTypeId.ROADMAP, 'map_style']
    });

    var infowindow = new google.maps.InfoWindow();

    var marker, i;

    for (i = 0; i < locations.length; i++) { 
      marker = new google.maps.Marker({
        position: new google.maps.LatLng(locations[i][1], locations[i][2]),
        map: map
      });

      google.maps.event.addListener(marker, 'click', (function(marker, i) {
        return function() {
          infowindow.setContent(locations[i][0]);
          infowindow.open(map, marker);
        }
      })(marker, i));
    }
     map.mapTypes.set('map_style', styledMap);
  map.setMapTypeId('map_style');
4

1 回答 1

0

这部分代码是错误的,它会阻止地图加载:

mapTypeId: [google.maps.MapTypeId.ROADMAP, 'map_style']

mapTypeId必须恰好是 1 有效mapType,而不是数组。您可以完全删除此行。

当您想为这些 mapType 绘制控件时,您必须改为设置 -property的mapTypeIds-option :mapTypeControlOptions

var map = new google.maps.Map(document.getElementById('map_canvas'), {
      zoom: 3,
      center: new google.maps.LatLng(45.92, 1.25),
      mapTypeControlOptions: {
       mapTypeIds: [google.maps.MapTypeId.ROADMAP, 'map_style']
      }
     });

您的地图现在应该显示 2 个所需的mapType控件。

要应用灰度saturation设置-100

于 2013-08-31T23:20:16.990 回答