Home 新闻中心 技术文档 OpenLayers中文教程文档

OpenLayers文档:ol/Map方法

发布时间:2021-12-12 23:00:53   浏览量:2745   作者:openlayers.org

地图是 OpenLayers 的核心组件。要渲染地图,需要一个视图、一个或多个图层和一个目标容器:

import Map from 'ol/Map'; import View from 'ol/View'; import TileLayer from 'ol/layer/Tile'; import OSM from 'ol/source/OSM'; var map = new Map({ view: new View({ center: [0, 0], zoom: 1 }), layers: [ new TileLayer({ source: new OSM() }) ], target: 'map' });

上面的代码片段使用 a 创建了一个地图module:ol/layer/Tile来显示module:ol/source/OSM~OSMOSM 数据并将其渲染到一个带有 id 的 DOM 元素map

构造函数ol-viewport在目标元素中放置一个视口容器(带有 CSS 类名 )(请参阅 参考资料getViewport()),然后在视口中放置另外两个元素:一个具有 ol-overlaycontainer-stopevent用于控件和一些叠加层的 CSS 类名称ol-overlaycontainer,另一个带有用于其他叠加层的CSS 类名称(请参阅 的stopEvent 选项以module:ol/Overlay~Overlay了解差异)。地图本身被放置在视口内的另一个元素中。

层存储module:ol/Collection~Collection在 layerGroups 中。库提供了一个顶级组。这是getLayerGroup访问的内容setLayerGroup在选项中输入的图层将添加到该组中,addLayerremoveLayer更改组中的图层集合。getLayers是 的便利函数 getLayerGroup().getLayers()请注意,它module:ol/layer/Group~Group 是 的子类module:ol/layer/Base,因此在选项中输入或添加的图层addLayer可以是组,其中可以包含更多组,依此类推。