openlayers学习笔记

三章-16-全屏控件

2020-04-20  本文已影响0人  彩云飘过

本文基于腾讯课堂老胡的课《跟我学Openlayers--基础实例详解》做的学习笔记,使用的openlayers 5.3.x api。

源码 见 1016.html ,对应的 官网示例 https://openlayers.org/en/latest/examples/scaleline-indiana-east.html?q=rotation

image.png
<!DOCTYPE html>
<html>

<head>
  <title>全屏控件的使用
  </title>
  <link rel="stylesheet" href="../include/ol.css" type="text/css">
  <script src="../include/ol.js"></script>

</head>
<style>

</style>

<body>

  <div id="map" class="map"></div>

  <script>
  
  var view = new ol.View({
        center: [-9101767, 2822912],
        zoom: 14
      });

      var map = new ol.Map({
        controls: ol.control.defaults().extend([
          new ol.control.FullScreen()
        ]),
        layers: [
          new ol.layer.Tile({
            source: new ol.source.BingMaps({
              key: 'As1HiMj1PvLPlqc_gtM7AqZfBL8ZL3VrjaS3zIb22Uvb9WKhuJObROC-qUpa81U5',
              imagerySet: 'Aerial'
            })
          })
        ],
        target: 'map',
        view: view
      });
  </script>
</body>

</html>
上一篇 下一篇

猜你喜欢

热点阅读