GeoTIFF / georaster-layer-for-leaflet

Display GeoTIFFs and soon other types of raster on your Leaflet Map
https://geotiff.github.io/georaster-layer-for-leaflet-example/
Apache License 2.0
283 stars 57 forks source link

Black region shown when loading GeoTiff #101

Open lliendo opened 2 years ago

lliendo commented 2 years ago

Hi there! I'm having an issue when loading a GeoTiff as explained in the README.md. I thought that I was doing something wrong so I also decided to try: Load GeoTIFF to check if I was making a mistake. The live example also behaves the same way. I do know that the GeoTIFF that I'm feeding the library is ok because I can open it with QGIS, here's a screenshot how it looks like:

Screenshot from 2022-06-22 10-57-29

In both the live example and my code I get:

Screenshot from 2022-06-22 10-58-30

I can provide the TIFF that actually produces this result. Here is some info from the file command:

latest.tif: TIFF image data, little-endian, direntries=22, height=1668, bps=32, compression=deflate, PhotometricIntepretation=BlackIsZero, description=xfarm-fields_2022-06-20, width=4570

and some info from the gdalinfo command:

Driver: GTiff/GeoTIFF
Files: latest.tif
Size is 4570, 1668
Coordinate System is:
GEOGCRS["WGS 84",
    DATUM["World Geodetic System 1984",
        ELLIPSOID["WGS 84",6378137,298.257223563,
            LENGTHUNIT["metre",1]]],
    PRIMEM["Greenwich",0,
        ANGLEUNIT["degree",0.0174532925199433]],
    CS[ellipsoidal,2],
        AXIS["geodetic latitude (Lat)",north,
            ORDER[1],
            ANGLEUNIT["degree",0.0174532925199433]],
        AXIS["geodetic longitude (Lon)",east,
            ORDER[2],
            ANGLEUNIT["degree",0.0174532925199433]],
    ID["EPSG",4326]]
Data axis to CRS axis mapping: 2,1
Origin = (15.755324600839618,46.629266420358242)
Pixel Size = (0.000095360657818,-0.000095360657818)
Metadata:
  AREA_OR_POINT=Area
  TIFFTAG_IMAGEDESCRIPTION=xfarm-fields_2022-06-20
  TIFFTAG_RESOLUTIONUNIT=1 (unitless)
  TIFFTAG_XRESOLUTION=1
  TIFFTAG_YRESOLUTION=1
Image Structure Metadata:
  COMPRESSION=DEFLATE
  INTERLEAVE=PIXEL
Corner Coordinates:
Upper Left  (  15.7553246,  46.6292664) ( 15d45'19.17"E, 46d37'45.36"N)
Lower Left  (  15.7553246,  46.4702048) ( 15d45'19.17"E, 46d28'12.74"N)
Upper Right (  16.1911228,  46.6292664) ( 16d11'28.04"E, 46d37'45.36"N)
Lower Right (  16.1911228,  46.4702048) ( 16d11'28.04"E, 46d28'12.74"N)
Center      (  15.9732237,  46.5497356) ( 15d58'23.61"E, 46d32'59.05"N)
Band 1 Block=4570x1 Type=Float32, ColorInterp=Gray
Band 2 Block=4570x1 Type=Float32, ColorInterp=Undefined

I'm kind of surprised that QGIS is always able to correctly display the file without providing it any extra information. The code that I'm using to try to load the GeoTiff is:

getGeoTiffMap() {
    return fetch(`${this.urls.static}/images/latest.tif`)
        .then(response => response.arrayBuffer())
        .then(arrayBuffer => {
            parse_georaster(arrayBuffer).then(georaster => {

            console.log("georaster:", georaster);

            let geoRasterLayer = new GeoRasterLayer({
                georaster: georaster,
                opacity: 0.7,
                //pixelValuesToColorFn: values => values[0] === 42 ? '#ffffff' : '#000000',
                //resolution: 512 // optional parameter for adjusting display resolution
            });
            geoRasterLayer.addTo(this.map);

            return geoRasterLayer;
        });
    });
}

which is almost the one shown in the README.md example (I played a bit with the options but with no success). Can this be a bug or am I doing something stupidly wrong? Any help/insights are highly appreciated! (as a side note I can't find a way to upload the original GeoTiff file to Github as an attachment to the issue, so if you need it just let me know).

Thanks, Lucas.

DanielJDufour commented 1 year ago

Hi, @lliendo . Thanks for reaching out. It could be a couple things going on. Do you know if there is a NoData Value set? I don't see one in the gdalinfo response, so I'm not sure how QGIS knows what to mask. It's also possible there is a ColorMap involved as well. georaster-layer-for-leaflet doesn't do great with colormaps.

If you like, you can email the file to daniel.j.dufour@gmail.com and I can help debug further. Thank you!

p.s. looks like a cool image!