三丶openlayer之source和layer

2023-11-28 07:28
文章标签 layer source openlayer

本文主要是介绍三丶openlayer之source和layer,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

1.source和layer的概念

在前面的例子中,已经对SourceLayer有所了解了,我们用天地图为底图加载出来东西,但是这个世界上的地图不仅仅是有天地图一种类型,比如Google地图,高德地图,百度地图等,如果OpenLayers支持的地图来源越多,就会越适用,越强大。除了加载基本的地图之外,GIS还需要加载很多其他的信息,比如街道名称,商店名称,公交站点,道路等等。那么在OpenLayers 中,具体该如何把这些添加在地图上呢?

首先需要明白的一点是,SourceLayer是一对一的关系,有一个Source,必然需要一个Layer,然后把这个Layer添加到Map上,就可以显示出来了。通过官网的API搜索ol.source可以发现有很多不同的Source,但归纳起来共三种:ol.source.Tileol.source.Image和ol.source.Vector

  • ol.source.Tile对应的是瓦片数据源,现在网页地图服务中,绝大多数都是使用的瓦片地图,而OpenLayers作为一个WebGIS引擎,理所当然应该支持瓦片。
  • ol.source.Image对应的是一整张图,而不像瓦片那样很多张图,从而无需切片,也可以加载一些地图,适用于一些小场景地图。
  • ol.source.Vector对应的是矢量地图源,点,线,面等等常用的地图元素(Feature),就囊括到这里面了。这样看来,只要这两种Source就可以搞定80%的需求了

从复杂度来分析,ol.source.Image和ol.source.Vector都不复杂,其数据格式和来源方式都简单。而ol.source.Tile则不一样,由于一些历史问题,多个服务提供商,多种标准等诸多原因,导致要支持世界上大多数的瓦片数据源,就需要针对这些差异提供不同的Tile数据源支持。在更进一步了解之前,我们先来看一下OpenLayers现在支持的Source具体有哪些:
在这里插入图片描述
上图中的类是按照继承关系,从左向右展开的,左边的为父类,右边的为子类。在使用时,一般来说,都是直接使用叶子节点上的类,基本就可以完成需求。父类需要自己进一步扩展或者处理才能有效使用的

我们先了解最为复杂的ol.source.Tile,其叶子节点类有很多,大致可以分为几类:

  1. 在线服务的Source,包括ol.source.BingMaps(使用的是微软提供的Bing在线地图数据),ol.source.MapQuest(使用的是MapQuest提供的在线地图数据)(注: 由于MapQuest开始收费,ol v3.17.0就移除了ol.source.MapQuest),ol.source.OSM(使用的是Open Street Map提供的在线地图数据),ol.source.Stamen(使用的是Stamen提供的在线地图数据)。没有自己的地图服务器的情况下,可直接使用它们,加载地图底图。
  2. 支持协议标准的Source,包括ol.source.TileArcGISRest,ol.source.TileWMS,ol.source.WMTS,ol.source.UTFGrid,ol.source.TileJSON。如果要使用它们,首先你得先学习对应的协议,之后必须找到支持这些协议的服务器来提供数据源,这些服务器可以是地图服务提供商提供的,也可以是自己搭建的服务器,关键是得支持这些协议。
  3. ol.source.XYZ,这个需要单独提一下,因为是可以直接使用的,而且现在很多地图服务(在线的,或者自己搭建的服务器)都支持xyz方式的请求。国内在线的地图服务,高德,天地图等,都可以通过这种方式加载,本地离线瓦片地图也可以,用途广泛,且简单易学,需要掌握。

ol.source.Image虽然有几种不同的子类,但大多比较简单,因为不牵涉到过多的协议和服务器提供商。而ol.source.Vector就更加的简单了,但有时候其唯一的子类ol.source.Cluster在处理大量的Feature时,我们可能需要使用。

在大概了解了整个Source之后,紧接着该介绍它的搭档Layer了,同样的,我们还是先从OpenLayers 3现有的Layer类图大致了解一下:
在这里插入图片描述
为了便于了解和使用,图中标注了每一个Layer对应的Source。通过上图可以看到Layer相对于Source而言,真是太简单了。

这篇关于三丶openlayer之source和layer的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/429291

相关文章

10 Source-Get-Post-JsonP 网络请求

划重点 使用vue-resource.js库 进行网络请求操作POST : this.$http.post ( … )GET : this.$http.get ( … ) 小鸡炖蘑菇 <!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-w

[Linux Kernel Block Layer第一篇] block layer架构设计

目录 1. single queue架构 2. multi-queue架构(blk-mq)  3. 问题 随着SSD快速存储设备的发展,内核社区越发发现,存储的性能瓶颈从硬件存储设备转移到了内核block layer,主要因为当时的内核block layer是single hw queue的架构,导致cpu锁竞争问题严重,本文先提纲挈领的介绍内核block layer的架构演进,然

fetch-event-source 如何通过script全局引入

fetchEventSource源码中导出了两种类型的包cjs和esm。但是有个需求如何在原生是js中通过script标签引呢?需要加上type=module。今天介绍另一种方法 下载源码文件: https://github.com/Azure/fetch-event-source.git 安装: npm install --save-dev webpack webpack-cli ts

Open Source, Open Life 第九届中国开源年会论坛征集正式启动

中国开源年会 COSCon 是业界最具影响力的开源盛会之一,由开源社在2015年首次发起,而今年我们将迎来第九届 COSCon! 以其独特定位及日益增加的影响力,COSCon 吸引了越来越多的国内外企业、高校、开源组织/社区的大力支持。与一般企业、IT 媒体、行业协会举办的行业大会不同,COSCon 具有跨组织、跨项目、跨社区的广泛覆盖面,也吸引了众多国内外开源开发者和开源爱好者的关注及参与

android xml之Drawable 篇 --------shape和selector和layer-list的

转自 : http://blog.csdn.net/brokge/article/details/9713041 <shape>和<selector>在Android UI设计中经常用到。比如我们要自定义一个圆角Button,点击Button有些效果的变化,就要用到<shape>和<selector>。 可以这样说,<shape>和<selector>在美化控件中的作用是至关重要。 在

JS实现将两个相同的json对象合并成为一个新对象(对象中包含list或者其他对象)source===target(不破坏target的非空值)

重点申明一下, 这个方法 只限于两个完全一样的对象 ,不一样的对象请使用 下面的进行合并,   <script>let form = {name: 'liming', sex: '男'};let obj = {class: '一班', age: 15};console.log('before', form);Object.assign(form, obj); //该方法可以完成console.

Matlab_learning_2(Pie‘s source code饼状图源码)

一、源代码 function hh = pie(varargin)%PIE Pie chart.% PIE(X) draws a pie plot of the data in the vector X. The values in X% are normalized via X/SUM(X) to determine the area of each slice of p

The steps for download android source code

The steps for download android source code. Except for the git tool, all the other steps is for both Windows and Linux. 以下描述是Windows上的操作步骤,其实windows和Linux上面的执行过程没有多大差别,仅在于git安装、Python脚本改成和机器上Pytho

Layer Normalization论文解读

基本信息 作者JL Badoi发表时间2016期刊NIPS网址https://arxiv.org/abs/1607.06450v1 研究背景 1. What’s known 既往研究已证实 batch Normalization对属于同一个Batch中的数据长度要求是相同的,不适合处理序列型的数据。因此它在NLP领域的RNN上效果并不显著,但在CV领域的CNN上效果显著。 2. What’s

Openlayer高阶样式使用

问题来源 因需要要使用到可叠加的openlayer样式,所以在官网的demo中找到两个例子,并从中提炼出我所需的样式基础。 Demo1 这个例子通过style数组来实现叠加型,核心是多写一个用于点的样式并利用geometry属性来套用得到叠加效果。 var styles = [/* We are using two different styles for the polygon