Использование Leaflet-Geotiff в приложении Angular 6

Question

Я столкнулся с проблемой, что я не могу отобразить любое изображение .tif на моей карте.Я использую плагин leaflet-geotiff для своей карты.Я скачал файл (например, из gis-lab.info , здесь ссылка для загрузки ) и попытался вставить и отобразить на моей карте.Но я всегда получаю 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 в leaflet-geotiff lib, чтобы быть уверенным, что файл tif проанализирован там):

Кажется в коде в leaflet-geotiff это происходит, когда plotHeight и plotWidthимеет отрицательные значения.И мой слой все еще не отображается на карте.Что я делаю неправильно?И как правильно отобразить пользовательский файл TIF?

Answer 1

Очевидно, ошибка Custom Mask is off screen. возникает, поскольку предоставленный файл представлен в WGS 84 / UTM zone 39N проекция

, в то время как geotiff.js библиотека (зависимость для leaflet-geotiff) поддерживает только EPSG:4326 файлы.

Из leaflet-geotiff файл readme:

url - URL файла GeoTIFF.В настоящее время поддерживаются только файлы EPSG: 4326.

После перепроецирования в (например, с помощью этот инструмент ) в EPSG:4326, оно может отображаться через leaflet-geotiff, например,