首页 / OpenLayers / 使用示例
自定义瓦片网格的矢量瓦片
瓦片网格由原点、分辨率序列与瓦片尺寸决定;把范围收窄到中国后,同一套 {z}/{x}/{y} 地址只会请求范围内的瓦片,橙色网格标出当前级别覆盖的瓦片。
源码与运行效果
说明
官方示例加载 Mapbox 矢量瓦片,并给瓦片图层指定自定义网格。网格由
ol.tilegrid.TileGrid 的 origin、resolutions、
tileSize 三件事决定;示例沿用 EPSG:3857 的全球原点与标准分辨率序列,
只把 extent 收窄到中国范围,于是同样的 {z}/{x}/{y} 地址
只会请求范围内的瓦片。
橙色网格由 grid.getTileCoordExtent([z, x, y]) 逐块算出范围,再用
ol.geom.Polygon.fromExtent() 画成矢量要素,可以直接看到当前级别覆盖了哪些瓦片。
| 操作 | 结果 |
|---|---|
| 取消勾选「显示瓦片网格」 | 网格矢量层隐藏,底图保留 |
| 缩放地图 | 请求的瓦片数量随级别变化,状态栏显示网格信息 |
resolutions 必须从粗到细排列,origin 与投影左上角一致,否则瓦片会错位一格。