Google maps добавляет переменную масштабирования

Question

Я успешно использую следующие скрипты, чтобы отметить различные точки на карте. Единственная проблема заключается в том, что значение по умолчанию для масштабирования «увеличено». я попытался поместить переменную масштабирования «zoom: 7», но ничего не помогает, пожалуйста, помогите?

function initialize() 
     { 
      var default_marker; 
      /* Map Style Start */ 
      var customMapType = new google.maps.StyledMapType([ 
       { 
        stylers: [ 
         {hue: '#F4B249'}, 
         {visibility: 'simplified'}, 
         {gamma: 0.5}, 
         {weight: 0.5} 
        ] 
       }, 
       { 
        elementType: 'labels', 
        stylers: [{visibility: 'off'}] 
       }, 
       { 
        featureType: 'water', 
        stylers: [{color: '#F4B249'}] 
       } 
      ], { 
       name: 'Custom Style', 
      }); 

      var customMapTypeId = 'custom_style'; 

      var map = new google.maps.Map(document.getElementById('map-canvas'), { 
       mapTypeControlOptions: { 
        mapTypeIds: [google.maps.MapTypeId.ROADMAP, customMapTypeId], 
       } 
      }); 
      map.mapTypes.set(customMapTypeId, customMapType); 
      map.setMapTypeId(customMapTypeId); 

      /* Map Style End */ 

      var bounds = new google.maps.LatLngBounds(); 
      var infowindow = new google.maps.InfoWindow(); 
      for (var i in LocationData) 
      { 
       var p = LocationData[i]; 
       var latlng = new google.maps.LatLng(p[0], p[1]); 
       bounds.extend(latlng); 

       var marker = new google.maps.Marker({ 
        position: latlng, 
        map: map, 
        title: p[2], 
        icon: p[3] 
       }); 
       if (p[4] == "default") // Default Marker 
        default_marker = marker; 

       google.maps.event.addListener(marker, 'click', function() { 
        infowindow.setContent(this.title); 
        map.setCenter(this.getPosition()); 
        infowindow.open(map, this); 
       }); 
      } 
      $("#btn-click").click(function() { 
       google.maps.event.trigger(default_marker, 'click'); 
      }); 
      map.fitBounds(bounds); 
      google.maps.event.addListenerOnce(map, 'idle', function() { 
       google.maps.event.trigger(default_marker, 'click'); 
      }); 
     } 
     google.maps.event.addDomListener(window, 'load', initialize); 

Answer 1

Возможно, вы указали масштаб неправильно. Использование

var map = new google.maps.Map(document.getElementById('map-canvas'), { 
    zoom: 7, 
    mapTypeControlOptions: { 
     mapTypeIds: [google.maps.MapTypeId.ROADMAP, customMapTypeId], 
    }, 
}); 

вместо кода

var map = new google.maps.Map(document.getElementById('map-canvas'), { 
    mapTypeControlOptions: { 
     mapTypeIds: [google.maps.MapTypeId.ROADMAP, customMapTypeId], 
    }, 
}); 

Также вы должны были предоставить парам центр ТРЕБУЕМОГО (как описано в Google-Maps API Docs)

Есть два обязательных варианта каждая карта: центр и зум.

Answer 2

Я считаю, вы добавили zoom в неправильном месте. У вас есть эта инициализация:

 var map = new google.maps.Map(document.getElementById('map-canvas'), { 
      mapTypeControlOptions: { 
       mapTypeIds: [google.maps.MapTypeId.ROADMAP, customMapTypeId], 
      }, 
     }); 

Может быть, вы добавили трансфокатора в качестве члена MapTypeControlOptions, но вы должны передать его в качестве члена основного объекта, переданного в качестве второго параметра, например:

 var map = new google.maps.Map(document.getElementById('map-canvas'), { 
      mapTypeControlOptions: { 
       mapTypeIds: [google.maps.MapTypeId.ROADMAP, customMapTypeId], 
      }, zoom: 5 
     }); 

Answer 3

Во-первых, поскольку KLin и Lajos сказали, вам нужно указать свойство масштабирования, когда вы инициализируете карту.

Затем вам необходимо удалить эту строку; он автоматически отрегулирует уровень масштабирования карты, чтобы он соответствовал всем маркерам, и он будет масштабироваться как можно дальше. например если у вас только 1 маркер, он будет увеличиваться до уровня 18 или около того.

map.fitBounds(bounds); 

С другой стороны, оставить его в (это поможет правильно расположить карту на маркеры тоже), но потом, отрегулируйте масштаб изображения карты:

map.setZoom(7);