16openlayers加载COG（云优化Geotiff）

1.前言

当在内网，没有GIS Server的时候，又想加载底图，一个办法就是使用COG。

2.实战

先用地图下载器，市面上有很多。下载一张geotiff。

将其使用GDAL命令处理成cog，命令如下：

gdal_translate z:\data\a.tif  z:\data\acog.tif -of COG  -co COMPRESS=JPEG

将其发布到nginx上，nginx的配置片段：

 location /tif {alias   "z:\\data\\";index  index.html index.htm;}

启动nginx，就可以用http://localhost/tif/acog.tif 访问了。

开始写前端代码：

main.js

import Map from 'ol/Map.js';
import TileLayer from 'ol/layer/WebGLTile.js';
import GeoTIFF from 'ol/source/GeoTIFF.js';const source = new GeoTIFF({sources: [{url: 'http://localhost/tif/acog.tif',},], convertToRGB:true
});

引入GeoTIFF的source、TileLayer，创建一个GeoTIFF source的对象。

convertToRGB:true，将其他色彩空间的颜色转换成RGB，即所见和用地图工具直接打开的效果一致。

var tileLayer = new TileLayer({source: source,})

创建一个TileLayer的图层对象，将tileLayer使用Map的addLayer方法添加进map对象中。