篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了html Google Maps API的调整测试相关的知识，希望对你有一定的参考价值。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Adjustment Test of Google Maps API</title>
<style>
#toggle {
position: absolute;
z-index: 1;
}
#map-canvas {
height: 80%;
left: 5%;
position: absolute;
top: 10%;
width: 90%;
z-index: 0;
}
</style>
<script src="//maps.googleapis.com/maps/api/js?key=AIzaSyCAdLvkz33nxRiABwlqlcBXYccNd0lRnGI"></script>
<script defer>
(function (w, d, n, GM) {
var fragment = d.createDocumentFragment();
var mapCanvas = d.createElement('div');
mapCanvas.setAttribute('id', 'map-canvas');
// It's OK to instantiate Map constructor before `DOMContentLoaded`
// IF you call `reset` process below after appending to DOM
var latLng = new GM.LatLng(35.6833, 139.6833);
var map = new GM.Map(mapCanvas, { center: latLng, zoom: 10 });
var toggled = true;
// Important process to redraw Google Maps DOM
var reset = function (center, zoom) {
// Force the map to trigger resize event
GM.event.trigger(map, 'resize');
// Adjust center and zoom from previous values
map.setCenter(center || map.getCenter());
map.setZoom(zoom || map.getZoom());
};
var toggle = function (ev) {
if (toggled) {
fragment.appendChild(mapCanvas);
toggled = false;
} else {
d.body.appendChild(fragment);
reset();
toggled = true;
}
};
var main = function () {
GM.event.addDomListener(d.getElementById('toggle'), 'click', toggle);
d.body.appendChild(mapCanvas); // Insert into the actual DOM
mapCanvas.style.position = 'absolute'; // Override Google Maps style once
reset(latLng, 10); // Do reset
};
GM.event.addDomListener(w, 'load', main);
})(window, document, navigator, google.maps);
</script>
</head>
<body>
<button id="toggle">toggle map view</button>
</body>
</html>
以上是关于html Google Maps API的调整测试的主要内容，如果未能解决你的问题，请参考以下文章