本文讨论内容是瓦片数据源（ol.source.Tile），主要从官方API文档入手，结合个人理解和案例进行展开。

首先看一下OpenLayers的地图图层数据源的层次结构，对ol.source.Source有个大致印象。

1 ol.source.Tile

抽象类；通常只用于创建子类，不实例化。

提供被切分为网格切片的图片数据的基类。

1.1 ol.source.TileDebug

并不从服务器获取瓦片数据，而是结合每个瓦片坐标为切片渲染一个网格轮廓，是假的瓦片数据源。

用于调试瓦片。

参考案例：http://openlayers.org/en/latest/examples/canvas-tiles.html

如图所示，地图中有两个图层：

一是OpenStreetMap提供的底图，数据源类型为ol.source.OSM；

二是黑色网格图层，数据源类型为ol.source.TileDebug，通过tileGrid属性绑定底图数据源瓦片网格，网格中显示数字为绑定对象对应瓦片的坐标（zoom，x，y）。

1.2 ol.source.TileUTFGrid

TileJSON 格式加载的 UTFGrid 交互数据图层数据源。

用于提供交互数据源。

参考案例：http://openlayers.org/en/latest/examples/tileutfgrid.html

如图所示，地图上显示的国名和国旗是ol.Overlay结合ol.source.TileUTFGrid数据源的对应坐标和分辨率的UTFGrid 交互数据所做的响应展示。

1.3 ol.source.UrlTile

通过http提供切分成切片的瓦片数据的数据源基类。

1.3.1 ol.source.TileImage

提供切分成切片的图片数据的数据源基类。

　1.3.1.1 ol.source.BingMaps

　1.3.1.2 ol.source.TileArcGISRest

　1.3.1.3 ol.source.TileJSON

　1.3.1.4 ol.source.TileWMS

　1.3.1.5 ol.source.WMTS

　1.3.1.6 ol.source.XYZ

　　1.3.1.6.1 ol.source.CartoDB

　　1.3.1.6.2 ol.source.OSM

　　1.3.1.6.3 ol.source.Stamen

　1.3.1.7 ol.source.Zoomify

1.3.2 ol.source.VectorTile

VectorTile是将矢量数据切分为瓦片格网的图层数据源类。

尽管这种数据源接收服务器上的矢量数据瓦片，但这并不是用于要素（Feature）编辑。矢量瓦片的主要目的是要素的优化渲染：在特定的分辨率下，几何（Geometry）根据瓦片边界或边界附近被切分并优化。

—————————————————————————————————

值得参考学习的文章：

1.OpenLayers 3 之 地图图层数据来源（ol.source）详解

http://blog.csdn.net/qingyafan/article/details/45950125

2.OpenLayers加载瓦片地图

http://weilin.me/ol3-primer/ch05/05-01.html

文章结合案例介绍了如何选择和加载瓦片地图，让我了解了OpenLayers瓦片地图的加载机制，并能够区分ol.source.TileImage和ol.source.XYZ的适用情况。

—————————————————————————————————

未完待续…

转载自：https://mtr-1.oss-cn-beijing.aliyuncs.com/qyblog/2019/04/72290191.jpg