共计 1106 个字符,预计需要花费 3 分钟才能阅读完成。
1. 比例尺分类
(1)数字式,用数字的比例式或分数式表示比例尺的大小。例如地图上 1 厘米代表实地距离 500 千米,可写成:1∶50 000 000 或写成:五千万分之一。
(2)线段式(也叫直线式),在地图上画一条线段,并注明地图上 1 厘米所代表的实际距离。
(3)文字式,在地图上用文字直接写出地图上 1 厘米代表实地距离多少千米,如:图上 1 厘米相当于地面距离 10 千米。
2.openlayers 中比例尺介绍
openlayers 中默认地图比例尺为直线式,如图 该比例尺存在精确测量无法读取比例尺实际值的缺点。因此有必要将直线比例尺转换成数字比例尺。
3. 实现方法
- 地图比例尺、分辨率、dpi 关系
openlayers 背景地图多为瓦片地图,瓦片地图分辨率(resolution)是非常重要的参数,其原理参考瓦片地图分辨率介绍;
地图比例尺受到分辨率,像素 dpi 以及地图投影关系等影响,他们之间的关系参考地图比例尺,分辨率,dpi 之间的关系
因此根据这三者的关系得到数字比例尺(digitalScale)的换算公式:
digitalScale=dpi/0.0254*resolution - 实现代码
<div id="map">
<div id="digitalScale"><span> 比例尺 1:</span><span id="zoom"></span></div>
</div>
<script>
var scaleLineControl=new ol.control.ScaleLine();// 定义比例尺控件
// 实例化地图
var map=new ol.Map({
layers:[
new ol.layer.Tile({source:new ol.source.OSM()
})
],
target:'map',
view:new ol.View({center:ol.proj.transform([104,30],'EPSG:4326','EPSG:3857'),
zoom:10
}),
controls:ol.control.defaults().extend([scaleLineControl])// 加载比例尺控件
});
// 监听分辨率变化,通过 dpi 和像素关系(比例尺 =dpi/0.0254* 分辨率)输出比例尺
map.getView().on('change:resolution', function(){document.getElementById('zoom').innerHTML = (this.getResolution())*3779.5275590551;// 这里使用了 View 中的 getResolution 方法获得当前 View 的分辨率。});
</script>
- 最终效果
正文完
发表至: javascript
2019-05-13