当我更改默认缩放设置时,Google Maps JavaScript API 不会缩放
The Google Maps JavaScript API is not zooming when I change the default zoom setting
缩放设置为8,我正在使用KmlLayer作为半径。无论我将缩放设置更改为缩放级别在网站上都保持不变:http://mainelyknowleslobster.com/delivery/。
<script>
function initAutocomplete() {
var map = new google.maps.Map(document.getElementById('map'), {
//center: {lat: 28.53687, lng: -81.38328},
center: {lat: 28.5893244, lng: -81.3744571},
zoom: 8,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
//Add marker and popup info
var contentString = '<div id="content">'+
'<div id="siteNotice">'+
'</div>'+
'<h4 id="firstHeading" class="firstHeading">MAINEly Knowles Lobster</h4>'+
'<div id="bodyContent">'+
'<p><center>887 Jackson Ave<br> Winter Park, FL 32789<br> Phone: <a href="tel:407-960-7441">407-960-7441</a><br> <a href="/contact/">Contact Us!</a></center></p>'+
'</div>'+
'</div>';
var infowindow = new google.maps.InfoWindow({
content: contentString
});
var marker = new google.maps.Marker({
position: {lat: 28.5893244, lng: -81.3744571},
map: map,
title: 'MAINEly Knowles Lobster'
});
marker.addListener('click', function() {
infowindow.open(map, marker);
});
// Create the search box and link it to the UI element.
var input = document.getElementById('pac-input');
var searchBox = new google.maps.places.SearchBox(input);
map.controls[google.maps.ControlPosition.TOP_LEFT].push(input);
// Bias the SearchBox results towards current map's viewport.
map.addListener('bounds_changed', function() {
searchBox.setBounds(map.getBounds());
});
// Polygon
var ctaLayer = new google.maps.KmlLayer({
url: 'http://mainelyknowleslobster.com/map/circle.kml',
map: map
});
var markers = [];
// [START region_getplaces]
// Listen for the event fired when the user selects a prediction and retrieve
// more details for that place.
searchBox.addListener('places_changed', function() {
var places = searchBox.getPlaces();
if (places.length == 0) {
return;
}
// Clear out the old markers.
markers.forEach(function(marker) {
marker.setMap(null);
});
markers = [];
// For each place, get the icon, name and location.
var bounds = new google.maps.LatLngBounds();
places.forEach(function(place) {
var icon = {
url: place.icon,
size: new google.maps.Size(71, 71),
origin: new google.maps.Point(0, 0),
anchor: new google.maps.Point(17, 34),
scaledSize: new google.maps.Size(25, 25)
};
// Create a marker for each place.
markers.push(new google.maps.Marker({
map: map,
icon: icon,
title: place.name,
position: place.geometry.location
}));
if (place.geometry.viewport) {
// Only geocodes have viewport.
bounds.union(place.geometry.viewport);
} else {
bounds.extend(place.geometry.location);
}
});
map.fitBounds(bounds);
});
// [END region_getplaces]
}
</script>
我在某处读到它可能与视口的视角有关。我添加了保留视口属性,但这并没有解决问题。我想知道KML图层是否与它有关:
directionsDisplay = new google.maps.DirectionsRenderer({
preserveViewport: true
});
您需要
为 KmlLayer 设置preserveViewport: true
// Polygon
var ctaLayer = new google.maps.KmlLayer({
url: 'http://mainelyknowleslobster.com/map/circle.kml',
preserveViewport: true,
map: map
});
概念验证小提琴
相关文章:
- 更改高贴图的缩放级别
- 在不阻止默认行为的情况下检测IE10中的缩放
- 单击超链接时,如何使用Google Maps API v3缩放地图
- 缩放Raphael/SVG容器以适应所有内容
- 传单缩放控制位置错误
- 在不移动内部文本的情况下缩放元素的效果
- 调整缩放窗口高度提升缩放
- 计算CSS3缩放框在另一个框中的最高位置
- D3.JS向rect添加缩放和列表项
- 当我在节点上拖动鼠标时,我如何防止使用d3.ehavior.zoom().on(“缩放”,重绘)
- 当我更改默认缩放设置时,Google Maps JavaScript API 不会缩放
- Google Maps API v3 禁用捏合以缩放 iPad Safari
- 如何在初始化期间在Google Maps API上动态设置缩放值
- 是否可以修改Google Maps V3中的缩放过渡?
- Google maps API V3:如何为平移设置相同的边界,无论缩放级别如何
- Google maps JS API在不平移地图的情况下缩放鼠标滚轮
- Google maps javascript API长按行为被缩放缩放分解
- Angular Google Maps指令在"place_changed"之后缩放太近事件
- 使用Google Maps API在点击地图时启用滚动轮缩放
- 在Google Maps API v3中设置基于地理定位精度的缩放级别