Google地图上的自定义缩放级别
[英]Custom zoom level on Google Maps
问题描述
I have a simple map with zoom level 4 at this point. 
此时我有一个缩放级别为4的简单地图。 Zoom level 5 is too big for me. 缩放等级5对我来说太大了。 Ideally, I'd like 4.6 zoom level which is possible in iOS SDK for Google maps. 理想情况下，我想要在iOS SDK for Google地图中使用4.6缩放级别。
Is there a way on how I can set the zoom level to 4.6? 有没有办法如何将缩放级别设置为4.6？ I want the map to occupy full page, so cannot really put in a div and use that part of it. 我希望地图占据整页，所以不能真正放入div并使用它的那一部分。
The objective is to show full USA in the center. 目标是在中心显示完整的美国。
<!DOCTYPE html>
<html>
<head>
<meta content="initial-scale=1.0, user-scalable=no" name="viewport">
<meta charset="utf-8">
<title>Map example</title>
<style>
html, body {
height: 100%;
margin: 0;
padding: 0;
}
#map {
height: 100%;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
var layer;
var layer1;
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 5,
center: {lat: 39.8282, lng: -98.5795}
});
}
</script>
<script async defer src=
"https://maps.googleapis.com/maps/api/js?key=AIzaSyBMtoh9P3UkoxbXndKu_HOP7KsVwTRvxGU&callback=initMap">
</script>
</body>
</html>
2 个解决方案
解决方案1
5 已采纳 2016-10-23 08:39:03
You can use CSS zoom to make your map fits your need. 您可以使用CSS缩放功能使地图满足您的需求。 For example, set Google map zoom to 4, then set #map zoom to 1.15 (because you want Google map zoom to 4.6 = 1.15 * 4) 例如，将Google地图缩放设置为4，然后将#map缩放设置为1.15（因为您希望Google地图缩放到4.6 = 1.15 * 4）
<html>
<head>
<meta content="initial-scale=1.0, user-scalable=no" name="viewport">
<meta charset="utf-8">
<title>Map example</title>
<style>
html, body {
height: 100%;
margin: 0;
padding: 0;
}
#map {
height: 100%;
zoom: 1.15;
}
</style>
</head>
<body>
<div id="map"></div>
<script>
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 4,
center: {lat: 39.8282, lng: -98.5795}
});
}
</script>
<script async defer src=
"https://maps.googleapis.com/maps/api/js?key=AIzaSyBMtoh9P3UkoxbXndKu_HOP7KsVwTRvxGU&callback=initMap">
</script>
</body>
</html>
解决方案2
2 2016-10-14 13:39:19
Zoom levels on Google Maps are integers. Google地图上的缩放级别为整数。 Full stop. 完全停止。 Your only option is to change the size of the div that contains the google.maps.Map object. 您唯一的选择是更改包含google.maps.Map对象的div的大小。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.