Attributions——属性控件

来源:互联网 发布:写作软件app 编辑:程序博客网 时间:2024/06/05 18:43

When the map gets too small because of a resize, the attribution will be collapsed. This is because thecollapsible option is set to true if the width of the map gets smaller than 600 pixels.
当地图因为重新调整大小而变得太小时,attribution控件将会折叠起来,这是因为当地图的宽小于600像素时attribution控件的collapsible属性会设置为true。
代码:
<!DOCTYPE html><html>  <head>    <title>Attributions</title>    <link rel="stylesheet" href="https://openlayers.org/en/v4.2.0/css/ol.css" type="text/css">    <!-- The line below is only needed for old environments like Internet Explorer and Android 4.x -->    <script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"></script>    <script src="https://openlayers.org/en/v4.2.0/build/ol.js"></script>  </head>  <body>    <div id="map" class="map"></div>    <script>      //初始化Attribution控件     var attribution = new ol.control.Attribution({         //不可折叠        collapsible: false      });      var map = new ol.Map({        layers: [          new ol.layer.Tile({            source: new ol.source.OSM()          })        ],        //不使用默认的Attribution控件而使用自己定义的Attribution控件,因为默认的是可以折叠的       controls: ol.control.defaults({attribution: false}).extend([attribution]),        target: 'map',        view: new ol.View({          center: [0, 0],          zoom: 2        })      });      //检查地图窗口的大小,如果小于600像素就将Attribution的collapsible属性设为true并折叠起来      function checkSize() {        var small = map.getSize()[0] < 600;        attribution.setCollapsible(small);        attribution.setCollapsed(small);      }      window.addEventListener('resize', checkSize);      checkSize();    </script>  </body></html>


原创粉丝点击