4-设置地图的缩放级别
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了4-设置地图的缩放级别相关的知识,希望对你有一定的参考价值。
参考技术A 地图分辨率,也称地面分辨率(Ground Resolution)或空间分辨率(Spatial Resolution),表示屏幕上一个像素(pixel)所代表的实际地面距离(米)。每一个分辨率,有一个对应的缩放等级,openlayers最大支持29级分辨率。
在ol中,可通过ol.View的zoom、minZoom和maxZoom参数来设置地图的缩放等级。
ol允许通过map.getView().getZoom()和map.getView().setZoom()来获取和设置地图的缩放级别,因此可以考虑创建两个按钮,分别控制地图视角的放大和缩小。效果如下:
如何设置谷歌地图缩放级别以显示所有标记?
【中文标题】如何设置谷歌地图缩放级别以显示所有标记?【英文标题】:How to set the Google Map zoom level to show all the markers? 【发布时间】:2011-01-22 16:05:27 【问题描述】:如何设置缩放级别以在 Google 地图上显示所有标记?
在我的 Google 地图中,不同位置有不同的标记。我想根据标记范围设置谷歌地图缩放级别(这意味着在谷歌地图的视图中,我想查看所有标记)
【问题讨论】:
【参考方案1】:你去吧:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps getBoundsZoomLevel Demo</title>
<script src="http://maps.google.com/maps?file=api&v=2&sensor=false"
type="text/javascript"></script>
</head>
<body onunload="GUnload()">
<div id="map" style="width: 400px; height: 300px"></div>
<script type="text/javascript">
if (GBrowserIsCompatible())
var map = new GMap2(document.getElementById("map"));
var markerBounds = new GLatLngBounds();
for (var i = 0; i < 10; i++)
var randomPoint = new GLatLng( 39.00 + (Math.random() - 0.5) * 20,
-77.00 + (Math.random() - 0.5) * 20);
map.addOverlay(new GMarker(randomPoint));
markerBounds.extend(randomPoint);
map.setCenter(markerBounds.getCenter(),
map.getBoundsZoomLevel(markerBounds));
</script>
</body>
</html>
我们在上面的例子中创建了 10 个随机点,然后将每个点传递给 GLatLngBounds.extend()
。最后我们用GMap2.getBoundsZoomLevel()
得到正确的缩放级别。
【讨论】:
【参考方案2】:设置 Google 地图缩放级别以显示所有标记?
地图 API v3
-
获取标记
获取标记的边界
通过将地图拟合到标记边界来设置地图中心
var markers = [markerObj1, markerObj2, markerObj3];
var newBoundary = new google.maps.LatLngBounds();
for(index in markers)
var position = markers[index].position;
newBoundary.extend(position);
map.fitBounds(newBoundary);
上面的代码将自动居中并缩放您的地图,以便所有标记都可见。
【讨论】:
【参考方案3】:如果您使用的是 API 版本 3,您可以替换
map.setCenter(markerBounds.getCenter(), map.getBoundsZoomLevel(markerBounds));
与
map.fitBounds(markerBounds).
【讨论】:
【参考方案4】:您可以使用GLatLngBounds 对象的extend
方法,它表示地图上的一个矩形。
var bounds = new GLatLngBounds();
围绕地图上的所有 points 循环,为每个扩展 GLatLngBounds 对象的边界。
bounds.extend(myPoint);
最后,您可以使用 bounds 对象来设置地图的中心和缩放(map
是您的地图对象)
map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds));
【讨论】:
以上是关于4-设置地图的缩放级别的主要内容,如果未能解决你的问题,请参考以下文章