openlayers学习之-----核心类

理解:OpenLayers里的各种,就是对GIS中各种事物的抽象

(1)Map-----整个地图容器。

可以理解为画板,里面什么都没有,但是一切都在里面发生~

使用之前要引入:import Map from 'ol/Map';

this.map = new Map({
.....//一切由此开始!!
});

别的类或者方法都是Map的配置项

(2)Layer-----图层。

-----如果你学过PS,则图层概念可以类比理解~

可以有很多个图层叠加在一起。每个图层对应一个图层包(有各种图层可选),便于管理。

例如:ol.layer.Tile

使用之前要引入:import {Tile as TileLayer} from "ol/layer";

this.map = new Map({
  target: myMap,//设置地图放在页面中的哪个元素里
  layers: [
    new TileLayer({
      .....//配置图层
    })
  ],
});

(3)Source-----数据源。

数据源和图层一一对应。每个数据源都对应一个资源包(有各种资源可选)。

例如:ol.source.OSM

使用之前要引入:import OSM from 'ol/source/OSM';

const myMap = this.$refs.myMap;
this.map = new Map({
  target: myMap,//设置地图放在页面中的哪个元素里
  layers: [
    new TileLayer({
      source: new OSM()//数据源
    })
  ]
});

(4)View-----总体展示。

控制地图显示的中心位置,范围,缩放层级等等。

使用之前要引入:import View from 'ol/View';

this.map = new Map({
  target: myMap,
  layers: [
    new TileLayer({
      source: new OSM()
    })
  ],
  view: new View({//配置展示、渲染项
    center: [0,0],//显示的中心经纬度
    zoom: 4//显示的缩放级别
  })
});

(5)Control-----控件

一些UI组件,比如:放大缩小按钮等等。

(6)Interaction-----交互

与用户进行交互,例如:用鼠标进行拖动、放大缩小等等。

原文地址:https://www.cnblogs.com/zhaoyingzhen/p/15179931.html