要更改Google Maps API控件的大小,可以通过以下步骤实现:
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap" async defer></script>
确保将YOUR_API_KEY
替换为您自己的Google Maps API密钥,并将initMap
替换为您的初始化地图函数。
function initMap() {
var mapOptions = {
center: { lat: 37.7749, lng: -122.4194 }, // 设置地图中心点的经纬度
zoom: 12, // 设置地图缩放级别
disableDefaultUI: true // 禁用默认的地图控件
};
var map = new google.maps.Map(document.getElementById('map'), mapOptions);
// 创建自定义控件
var customControl = document.createElement('div');
customControl.style.width = '100px'; // 设置控件的宽度
customControl.style.height = '100px'; // 设置控件的高度
customControl.style.backgroundColor = 'red'; // 设置控件的背景颜色
// 将自定义控件添加到地图上
map.controls[google.maps.ControlPosition.TOP_RIGHT].push(customControl);
}
在上述代码中,您可以通过设置customControl.style.width
和customControl.style.height
来更改控件的大小。还可以根据需要调整其他样式属性。
<div id="map" style="width: 100%; height: 400px;"></div>
确保将width
和height
属性设置为适当的值,以便容纳您更改后的控件大小。
领取专属 10元无门槛券
手把手带您无忧上云