Exploring COGs in the browser with geotiff.js and COG-Explorer

Fabian Schindler - 

https://slides.com/fschindler/exploring-cogs-in-the-browser-with-geotiff-js-and-cog-explorer

About us

https://eox.at

geotiff.js

https://geotiffjs.github.io/

geotiff.js

• Written in pure JavaScript
• Usable in any JavaScript runtime providing the web platform
  • Browser
  • Node

geotiff.js functionality

• Access TIFFs
• Extract raster data
• Extract RGB imagery

Access

• Local files
• Remote files
  • HTTP range requests
• Fetch only required portions
• Metadata

Extraction of Raster Data

• Variants
• Subset
  • bounding box / image window
  • Sub-image
  • Component
• Decompression
• Resampling
• Automatic selection of overview

RGB

• Basic transformation of raw data to viewable images
• Colorspace translation
• Color lookup tables

COG-Explorer

https://geotiffjs.github.io/cog-explorer/

COG-Explorer

• Proof of concept:
  • Efficient visualization of huge TIFFs in the browser
• OpenLayer based Map-Application
• WebGL based composition and rendering 

COG-Explorer: Zooming

COG-Explorer: Input Bands

COG-Explorer: Manipulation

COG-Explorer: https://eurodatacube.com

(Data orders are STAC Catalogs)

Next:

OpenLayers GLTiles

Made by this guy

(Iván Sánchez Ortega)

OpenLayers GLTiles

• OpenLayers Layer Source
• Combines:
  • geotiff.js (or compatible raster source)
  • WebGL
  • OpenLayers

GLTiles: CORINE Landcover

GLTiles: CORINE Landcover