介绍 & lt; !DOCTYPE html>
& lt; html lang=癳n"祝辞
& lt; head>
& lt;元charset=癠TF-8"祝辞
& lt; title>加载鹰眼控件以及实现地图比例尺& lt;/title>
& lt;链接rel=皊tylesheet"href=https://www.yisu.com/zixun/癱ss/bootstrap.min.css”>
js/ol.js
本篇文章给大家分享的是有关使用OpenLayers3实现地图鹰眼以及地图比例尺的添加,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。
<强> 1。前言
地图鹰眼就是地图的鸟瞰图,就是通常所说的小地图,我们可以通过鹰眼得到当前地图的显示位置,也可以在鹰眼上单击,拖动或移动到想要查看的位置,鹰眼的可见区域比我们所看的主视区的范围要大,鹰眼的中心框就是主视区的可视范围,Openlayers 3封装的鹰眼控件为ol.control。OverviewMap,可以自定义其显示的样式。
<强> 2。实现思路
(1)新建一个网页,并参考前面的文章实现地图显示功能,加载OSM瓦片图层。
(2)实例化一个鹰眼控件(ol.control。OverviewMap),跟前面的一样,可以实例化一个默认的鹰眼控件,也可以根据需要设置其参数。
(3)将实例化的鹰眼控件加载到地图容器中。可以在实例化地图容器地图的代码中,通过设置控制参数加载鹰眼控件,也可以调用地图对象的addControl方法加载控件。
<强> 3。实现代码
HTML:
