maxZoom和风格的谷歌融合地图

Question

当我使用样式化的Google地图时，它会忽略我设置的maxZoom和minZoom，从而完全删除缩放条。如果我不包含StyledMapType，缩放限制就会起作用。我错过什么了吗?或者maxZoom/minZoom不支持StyledMapType?

谢谢你的帮助。

function initialize() {
  map = new google.maps.Map(document.getElementById('map-canvas'), {
    center: new 
  google.maps.LatLng(29.45, -95.75),
    zoom: 10
  });

   var style = [
    {
      featureType: 'all',
      elementType: 'all',
      stylers: [
        { saturation: -99 }
      ]
    },
           {
      featureType: 'road.local',
      elementType: 'all',
      stylers: [
        { visibility: 'off' }
      ]
    },
    {
      featureType: 'administrative.land_parcel',
      elementType: 'all',
      stylers: [
        { visibility: 'off' }
      ]
    }
  ];


   var styledMapType = new google.maps.StyledMapType(style, {
    map: map,
    name: 'Styled Map'
  });

   map.mapTypes.set('map-style', styledMapType);


  google.maps.event.addListenerOnce(map, "projection_changed", function(){
  map.setMapTypeId('map-style');        
    layer_0 = new google.maps.FusionTablesLayer({
    query: {
      select: "col3",
      from: "14XfhpSuNK0aSJkbnb5UFrsE1UPRE_wr4d9IwKjW7"
    },
    map: map,
    styleId: 2,
    templateId: 2
  });
  setZoomLimit(map, google.maps.StyledMapType);
  setZoomLimit(map, google.maps.MapTypeId.ROADMAP);
  setZoomLimit(map, google.maps.MapTypeId.HYBRID);
  setZoomLimit(map, google.maps.MapTypeId.SATELLITE);
  setZoomLimit(map, google.maps.MapTypeId.TERRAIN);
  map.setMapTypeId(google.maps.StyledMapType);  
}); 
  layer_0 = new google.maps.StyledMapType({
    query: {
      select: "col3",
      from: "14XfhpSuNK0aSJkbnb5UFrsE1UPRE_wr4d9IwKjW7"
    },
    map: map,
    styleId: 2,
    templateId: 2
  });
}
  function setZoomLimit(map, mapTypeId){
  var mapTypeRegistry = map.mapTypes;
var mapType = mapTypeRegistry.get(mapTypeId);
mapType.maxZoom = 13;  
mapType.minZoom = 8; }

Answer 1

1. 你的代码生成javascript错误:Uncaught TypeError: Cannot set property 'maxZoom' of undefined在这一行:mapType.maxZoom = 13;。没有google.maps.StyledMapType。样式化地图的mapTypeId是"map-style"。你不能设置"undefined"的maxZoom属性

2. 这是不正确的，不知道它应该做什么，我认为没有必要。

layer_0 = new google.maps.StyledMapType({
  query: {
    select: "col3",
    from: "14XfhpSuNK0aSJkbnb5UFrsE1UPRE_wr4d9IwKjW7"
  },
  map: map,
  styleId: 2,
  templateId: 2
});

工作小提琴

代码片段:

var map;
function initialize() {
  map = new google.maps.Map(document.getElementById('map-canvas'), {
    center: new
    google.maps.LatLng(29.45, -95.75),
    zoom: 10
  });
  var style = [{
    featureType: 'all',
    elementType: 'all',
    stylers: [{
      saturation: -99
    }]
  }, {
    featureType: 'road.local',
    elementType: 'all',
    stylers: [{
      visibility: 'off'
    }]
  }, {
    featureType: 'administrative.land_parcel',
    elementType: 'all',
    stylers: [{
      visibility: 'off'
    }]
  }];
  var styledMapType = new google.maps.StyledMapType(style, {
    map: map,
    name: 'Styled Map'
  });
  map.mapTypes.set('map-style', styledMapType);
  google.maps.event.addListenerOnce(map, "projection_changed", function() {
    setZoomLimit(map, 'map-style');
    setZoomLimit(map, google.maps.MapTypeId.ROADMAP);
    setZoomLimit(map, google.maps.MapTypeId.HYBRID);
    setZoomLimit(map, google.maps.MapTypeId.SATELLITE);
    setZoomLimit(map, google.maps.MapTypeId.TERRAIN);
    map.setMapTypeId('map-style');
  });
  layer_0 = new google.maps.FusionTablesLayer({
    query: {
      select: "col3",
      from: "14XfhpSuNK0aSJkbnb5UFrsE1UPRE_wr4d9IwKjW7"
    },
    map: map,
    styleId: 2,
    templateId: 2
  });
}
google.maps.event.addDomListener(window, 'load', initialize);
function setZoomLimit(map, mapTypeId) {
  var mapTypeRegistry = map.mapTypes;
  var mapType = mapTypeRegistry.get(mapTypeId);
  mapType.maxZoom = 13;
  mapType.minZoom = 8;
}

html,
body,
#map-canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}

<script src="https://maps.googleapis.com/maps/api/js"></script>
<div id="map-canvas" style="border: 2px solid #3872ac;"></div>