Question

我在Google's instructions之后为Google地图添加了一个额外的样式。但是我没有成功添加多种风格。这可以实现吗？如果是这样，怎么样？以下是一个示例：http://jsfiddle.net/mikegoodstadt/A9zwa/3/ 非常感谢任何建议，麦克

  var geocoder;
  var map;
  var MAPTYPE_1;
  var MAPTYPE_2;

  function initialize() {
    geocoder = new google.maps.Geocoder();
    var latlngLondon = new google.maps.LatLng(51.507335, -0.127683);
    var latlngMarrakech = new google.maps.LatLng(34.02590, -6.83640);

    var style1 = [
     {
       "stylers": [
         { "visibility": "on" },
         { "weight": 0.9 },
         { "gamma": 0.99 },
         { "lightness": -4 },
         { "hue": "#ffc300" },
         { "saturation": -14 }
       ]
     }
    ];
    var style2 = [
     {
       "stylers": [
         { "visibility": "on" },
         { "weight": 0.9 },
         { "gamma": 0.99 },
         { "lightness": -4 },
         { "hue": "#ff6e00" },
         { "saturation": -14 }
       ]
     }
    ];

    var mapOptions = {
      zoom: 12,
      center: latlngLondon,
      mapTypeControl: 1,
      panControl: 0,
      streetViewControl: 0,
      zoomControl: 0,
      mapTypeControlOptions: {
        mapTypeIds: [google.maps.MapTypeId.ROADMAP, MAPTYPE_1, MAPTYPE_2]
      },
    };

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

    var mapType1 = new google.maps.StyledMapType(style1, {name: 'London'});
    var mapType2 = new google.maps.StyledMapType(style2, {name: 'Marrakech'});

    map.mapTypes.set(MAPTYPE_1, mapType1);
    map.mapTypes.set(MAPTYPE_2, mapType2);


  }

  function codeAddress() {
    var address = document.getElementById("search-address").value;
    geocoder.geocode( { 'address': address}, function(results, status) {
      if (status == google.maps.GeocoderStatus.OK) {
        map.setCenter(results[0].geometry.location);
        var marker = new google.maps.Marker({
            map: map,
            position: results[0].geometry.location
        });
      } else {
        alert("Buscedad sin exito: " + status);
      }
    });
  }

Answer 1

您需要声明/设置setMapTypeIDs

 map.mapTypes.set('MAPTYPE_1', mapType1);
 map.setMapTypeId('MAPTYPE_1');

 map.mapTypes.set('MAPTYPE_2', mapType2);
 map.setMapTypeId('MAPTYPE_2');

如何使用StyledMapType添加多种样式的Google Maps？

1 个答案: