在Angular 6应用程序中使用小叶geotiff

Question

我遇到了无法在地图上显示任何.tif图片的问题。我的地图使用leaflet-geotiff插件。我下载了文件（例如从gis-lab.info，这里是link to download），并尝试粘贴并显示在我的地图上。但我总是得到Custom Mask is off screen.

以下是我的用法示例：

import * as geotiff from 'leaflet-geotiff/leaflet-geotiff';
import * as plotty from 'leaflet-geotiff/leaflet-geotiff-plotty';

export class MapComponent {

    ngOnInit() {
        this.map.on('load', () => {
            const options = {
                band: 0,
                name: 'Custom Mask',
                opacity: 1,
                renderer: new plotty.Plotty({
                    colorScale: 'greys'
                })
            };
            new geotiff.LeafletGeotiff('assets/uploads/clearcuts_174016_20101018_clip.tif', options).addTo(this.leafletMap);
        });
    }
}

这也是我在浏览器控制台中拥有的功能（我在console.log lib中添加了一些leaflet-geotiff，以确保tif文件在那里被解析）：

leaflet-geotiff中的代码似乎在plotHeight和plotWidth具有负值时发生。而且我的图层仍未显示在地图上。我究竟做错了什么？以及如何正确显示自定义tif文件？

Answer 1

显然，由于provided file表示为WGS 84 / UTM zone 39N投影，因此发生了错误Custom Mask is off screen.

geotiff.js library仅支持EPSG:4326文件（leaflet-geotiff的依赖性）。

来自leaflet-geotiff自述文件：

  

url-GeoTIFF文件的URL。当前仅支持EPSG：4326文件。

一旦重新投影到EPSG:4326（例如，使用this tool），就可以像这样通过leaflet-geotiff显示它