Openlayers初步实现地图功能

openlayers

一.地图初始化

• 实现形式

　　一：使用高德地图的URL模板加载地图瓦片

 

　　二：使用OpenLayer加载本地geoserver地图

 

• 地图图层
  • 使用ol.layer.Tile创建一个新的瓦片图层，其源设置为ol.source.XYZ或ol.source.TileWMS

• ol.source.TileWMS
  • 概述：
    • ol.source.TileWMS是OpenLayers中用于加载WMS（Web Map Service）服务的图层数据源。WMS是一种允许网络客户端从服务器请求地图图像的协议

• • 主要特性和用途：
    • WMS服务：专门用于加载WMS服务提供的地图图层。WMS服务可以动态生成地图图像，根据客户端的请求（如图层、样式、坐标范围等）进行渲染。
    • 灵活性：WMS服务支持多种地图样式和图层组合，可以通过请求参数进行配置，以实现高度自定义的地图展示。
    • 参数配置：在ol.source.TileWMS的构造函数中，需要配置WMS服务的URL、图层（LAYERS）、样式（STYLES）、版本（VERSION）等参数。

• ol.source.XYZ地图对象
  • 概述：
    • ol.source.XYZ是OpenLayers中用于加载XYZ格式（或称为“滑动瓦片”格式）的地图图层数据源。XYZ格式是一种简单的瓦片地图服务协议，通过URL模板来请求不同层级（z）、行（y）和列（x）的瓦片。
  • 主要特性和用途：
    • 简单性：XYZ格式简单直观，通过URL模板即可访问瓦片数据，无需复杂的参数配置。
    • 广泛支持：许多地图服务提供商（如OpenStreetMap、高德地图等）都提供XYZ格式的瓦片服务。
    • 灵活性：虽然XYZ格式相对简单，但通过自定义URL模板，可以灵活地接入不同的瓦片数据源。
• 地图对象
  • 使用ol.Map创建地图实例，指定目标DOM元素（map div）、图层列表和视图设置（包括中心点、缩放级别、投影等）。

 

二.特征点和矢量图层

• 示例代码

 

• 第一步：创建点特征（Feature）
  • 创建一个ol.Feature对象，这是OpenLayers中用于表示地图上单个地理实体的对象。即创建了一个点特征，其地理位置由经纬度坐标定义。
  • 这里，ol.geom.Point是一个表示点的几何对象，它接受一个包含经度和纬度的数组作为参数。
• 第二步：应用样式到特征点
  • 将样式（style）应用到这个特征点上。样式可以定义点的形状、颜色、大小等属性。
• 第三步：创建包含特征点的矢量图层源（VectorSource）
  • 创建了一个ol.source.Vector对象，这是一个矢量图层的数据源。向它的features属性传递了一个点特征的数组。这样，这个矢量数据源就包含了你的点特征。

• 第四步：创建矢量图层并将其添加到地图上
  • 使用ol.layer.Vector创建了一个矢量图层，并将之前创建的矢量数据源（包含你的点特征）作为参数传递给它的source属性。然后，使用map.addLayer方法将这个矢量图层添加到了地图上。

三.控件

• 缩放至范围控件 (ZoomToExtent): 允许用户通过控件缩放地图到预设的范围。

• 缩放条控件 (zoomslider): 提供滑动条来控制地图的缩放级别。

• 全屏控件 (fullScreen): 允许用户通过控件将地图全屏显示。

• 比例尺控件 (scaleLineControl): 显示地图的比例尺。