Openlayers学习之加载鹰眼控件

本文实例为大家分享了Openlayers学习之加载鹰眼控件，供大家参考，具体内容如下

1、新建一个html页面，引入ol.js和ol.css文件，然后在body中创建一个div标签，用来作为地图加载的容器；

2、代码实现

 
 
 
 
   
   .myOverview,.myOverview.ol-uncollapsible
   {
    bottom:auto;
    left:auto;
    right:0px;
    top:0px;
   }
   
   .myOverview:not(.ol-collapsed)
   {
    border:1px solid black;
   }
   
   .myOverview .ol-overviewmap-map
   {
    border:none;
    width:300px;
   }
   
   .myOverview .ol-overviewmap-box
   {
    border:2px solid red;
   }
   
   .myOverview:not(.ol-collapsed) button
   {
    bottom:auto;
    left:auto;
    right:1px;
    top:1px;
   }
 
 


 

3、结果展示

初始化地图完成后，会在地图的右上角看见当前区域的鹰眼视图

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持考高分网。