基于vue添加概览图控件

最新推荐文章于 2022-12-07 00:54:03 发布

~HT猫L~

最新推荐文章于 2022-12-07 00:54:03 发布

阅读量333

点赞数 1

分类专栏： openlayers 文章标签： openlayers

本文链接：https://blog.csdn.net/weixin_44614518/article/details/121774652

版权

openlayers 专栏收录该内容

8 篇文章 4 订阅

订阅专栏

概览图控件不需要给一个div，默认显示在左下角

引入包

import {OverviewMap, defaults as defaultControls } from "ol/control";
import OSM from 'ol/source/OSM';

const OverviewMapSource = new OSM();
      this.overviewMapControl = new OverviewMap({
        layers: [
          new TileLayer({
            source: OverviewMapSource,
          }),
        ],
      });

this.map = new Map({
        target: "olMap",
        view: new View({
          center: [108.945951, 34.465262],
          zoom: 4,
          projection: "EPSG:4326",
        }),        
         controls: defaultControls({
          //   控制左上角的缩放图标
          zoom: false,
        }).extend([this.overviewMapControl]),
      });