Newbee in js here ...我正试图在我的网站上显示我的谷歌地图更加放大。在
中更改缩放编号 zoom: 15,
无效。这里有什么不对?请帮忙。请参阅jsfiddle中的问题。
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 15,
center: {lat: 52.132633, lng: 5.291266}
});
var georssLayer = new google.maps.KmlLayer({
url: 'https://www.tso-assistent.nl/js/TSO-ASSISTENT.kmz',
});
georssLayer.setMap(map);
}
// https://developers.google.com/maps/documentation/javascript/examples/icon-simple
// Loop through the results array and place a marker for each
// set of coordinates.
window.eqfeed_callback = function(results) {
for (var i = 0; i < results.features.length; i++) {
var coords = results.features[i].geometry.coordinates;
var latLng = new google.maps.LatLng(coords[1],coords[0]);
var marker = new google.maps.Marker({
position: latLng,
map: map
});
}
}
/* Always set the map height explicitly to define the size of the div
* element that contains the map. */
#map {
height: 100%;
}
/* Optional: Makes the sample page fill the window. */
html, body {
height: 100%;
margin: 0;
padding: 0;
}
<div id="map"></div>
<!-- Replace the value of the key parameter with your own API key. -->
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBqjPjdmeqpVPBJqQ2QxOvk6g8uHRTou9k&callback=initMap"></script>
答案 0 :(得分:0)
您的KML图层会覆盖缩放值。
要保留缩放,您应使用preserveViewport: true
你应该这样使用
var georssLayer = new google.maps.KmlLayer({
url: 'https://www.tso-assistent.nl/js/TSO-ASSISTENT.kmz',
preserveViewport: true
});
更新了fiddle
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 7,
center: {lat: 52.132633, lng: 5.291266}
});
var georssLayer = new google.maps.KmlLayer({
url: 'https://www.tso-assistent.nl/js/TSO-ASSISTENT.kmz',
preserveViewport: true
});
georssLayer.setMap(map);
}
// https://developers.google.com/maps/documentation/javascript/examples/icon-simple
// Loop through the results array and place a marker for each
// set of coordinates.
window.eqfeed_callback = function(results) {
for (var i = 0; i < results.features.length; i++) {
var coords = results.features[i].geometry.coordinates;
var latLng = new google.maps.LatLng(coords[1],coords[0]);
var marker = new google.maps.Marker({
position: latLng,
map: map
});
}
}
/* Always set the map height explicitly to define the size of the div
* element that contains the map. */
#map {
height: 100%;
}
/* Optional: Makes the sample page fill the window. */
html, body {
height: 100%;
margin: 0;
padding: 0;
}
<div id="map"></div>
<!-- Replace the value of the key parameter with your own API key. -->
<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBqjPjdmeqpVPBJqQ2QxOvk6g8uHRTou9k&callback=initMap"></script>