added GeoTIFFTileLayer (#28)

* added GeoTIFFTileLayer

* ApiKey

* Update Playwright Snapshots

---------

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

ipyopenlayers/Map.py

@@ -24,10 +24,10 @@ class Layer(Widget):
     _view_module = Unicode(module_name).tag(sync=True)
     _view_module_version = Unicode(module_version).tag(sync=True)
 
-class TileLayer(Layer):
+class RasterTileLayer(Layer):
 
-    _model_name = Unicode('TileLayerModel').tag(sync=True)
-    _view_name = Unicode('TileLayerView').tag(sync=True)
+    _model_name = Unicode('RasterTileLayerModel').tag(sync=True)
+    _view_name = Unicode('RasterTileLayerView').tag(sync=True)
 
     url = Unicode('https://{a-c}.tile.openstreetmap.org/{z}/{x}/{y}.png').tag(sync=True)
 
@@ -39,6 +39,10 @@ class GeoJSON(Layer):
     style = Dict({}).tag(sync=True)
     visible = Bool(True).tag(sync=True)
 
+class GeoTIFFTileLayer(Layer):
+   _model_name = Unicode('GeoTIFFTileLayerModel').tag(sync=True)
+   _view_name = Unicode('GeoTIFFTileLayerView').tag(sync=True)
+   sources = List(Dict).tag(sync=True)
 
 class HeatmapLayer(Layer):
     _view_name = Unicode('HeatmapLayerView').tag(sync=True)

package.json

@@ -80,7 +80,7 @@
     "ts-jest": "^29.1.2",
     "ts-loader": "^9.5.1",
     "typescript": "~5.3.3",
-    "webpack": "^5.90.0",
+    "webpack": "^5.93.0",
     "webpack-cli": "^5.1.4"
   },
   "devDependenciesComments": {

src/geotifflayer.ts

@@ -0,0 +1,69 @@
+// Copyright (c) QuantStack
+// Distributed under the terms of the Modified BSD License.
+import { DOMWidgetModel, ISerializers } from '@jupyter-widgets/base';
+import WebGLTileLayer from 'ol/layer/WebGLTile.js';
+import GeoTIFF from 'ol/source/GeoTIFF.js';
+import { MODULE_NAME, MODULE_VERSION } from './version';
+import { LayerModel, LayerView } from './layer';
+
+export class GeoTIFFTileLayerModel extends LayerModel {
+  defaults() {
+    return {
+      ...super.defaults(),
+      _model_name: GeoTIFFTileLayerModel.model_name,
+      _model_module: GeoTIFFTileLayerModel.model_module,
+      _model_module_version: GeoTIFFTileLayerModel.model_module_version,
+      _view_name: GeoTIFFTileLayerModel.view_name,
+      _view_module: GeoTIFFTileLayerModel.view_module,
+      _view_module_version: GeoTIFFTileLayerModel.view_module_version,
+      source: [],
+    };
+  }
+
+  static serializers: ISerializers = {
+    ...DOMWidgetModel.serializers,
+    // Add any extra serializers here
+  };
+
+  static model_name = 'GeoTIFFTileLayerModel';
+  static model_module = MODULE_NAME;
+  static model_module_version = MODULE_VERSION;
+  static view_name = 'GeoTIFFTileLayerView';
+  static view_module = MODULE_NAME;
+  static view_module_version = MODULE_VERSION;
+}
+
+export class GeoTIFFTileLayerView extends LayerView {
+  render() {
+    super.render();
+    this.sourcesChanged();
+    this.model.on('change:sources', this.sourcesChanged, this);
+  }
+
+  create_obj() {
+    const sources = this.model.get('sources').map((source: any) => ({
+      url: source.url,
+    }));
+
+    this.obj = this.tileLayer = new WebGLTileLayer({
+      source: new GeoTIFF({
+        sources: sources,
+      }),
+    });
+  }
+
+  sourcesChanged() {
+    const newSources = this.model.get('sources').map((source: any) => ({
+      url: source.url,
+    }));
+
+    if (newSources) {
+      const newSource = new GeoTIFF({
+        sources: newSources,
+      });
+      this.tileLayer.setSource(newSource);
+    }
+  }
+
+  tileLayer: WebGLTileLayer;
+}

src/index.ts

@@ -2,5 +2,3 @@
 // Distributed under the terms of the Modified BSD License.
 export * from './version';
 export * from './widget';
-export * from './tilelayer';
-export * from './basecontrol';

src/tilelayer.ts → src/rastertilelayer.ts

@@ -8,16 +8,16 @@ import { MODULE_NAME, MODULE_VERSION } from './version';
 import { MapView } from './widget';
 import { LayerModel, LayerView } from './layer';
 
-export class TileLayerModel extends LayerModel {
+export class RasterTileLayerModel extends LayerModel {
   defaults() {
     return {
       ...super.defaults(),
-      _model_name: TileLayerModel.model_name,
-      _model_module: TileLayerModel.model_module,
-      _model_module_version: TileLayerModel.model_module_version,
-      _view_name: TileLayerModel.view_name,
-      _view_module: TileLayerModel.view_module,
-      _view_module_version: TileLayerModel.view_module_version,
+      _model_name: RasterTileLayerModel.model_name,
+      _model_module: RasterTileLayerModel.model_module,
+      _model_module_version: RasterTileLayerModel.model_module_version,
+      _view_name: RasterTileLayerModel.view_name,
+      _view_module: RasterTileLayerModel.view_module,
+      _view_module_version: RasterTileLayerModel.view_module_version,
     };
   }
 
@@ -26,15 +26,15 @@ export class TileLayerModel extends LayerModel {
     // Add any extra serializers here
   };
 
-  static model_name = 'TileLayerModel';
+  static model_name = 'RasterTileLayerModel';
   static model_module = MODULE_NAME;
   static model_module_version = MODULE_VERSION;
-  static view_name = 'TileLayerView';
+  static view_name = 'RasterTileLayerView';
   static view_module = MODULE_NAME;
   static view_module_version = MODULE_VERSION;
 }
 
-export class TileLayerView extends LayerView {
+export class RasterTileLayerView extends LayerView {
   map_view: MapView;
 
   render() {

src/widget.ts

@@ -28,8 +28,9 @@ export * from './zoomslider';
 export * from './fullscreen';
 export * from './scaleline';
 export * from './mouseposition';
-export * from './tilelayer';
+export * from './rastertilelayer';
 export * from './heatmap';
+export * from './geotifflayer';
 
 const DEFAULT_LOCATION = [0.0, 0.0];
 

yarn.lock

@@ -2779,6 +2779,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"acorn-import-attributes@npm:^1.9.5":
+  version: 1.9.5
+  resolution: "acorn-import-attributes@npm:1.9.5"
+  peerDependencies:
+    acorn: ^8
+  checksum: 1c0c49b6a244503964ae46ae850baccf306e84caf99bc2010ed6103c69a423987b07b520a6c619f075d215388bd4923eccac995886a54309eda049ab78a4be95
+  languageName: node
+  linkType: hard
+
 "acorn-jsx@npm:^5.3.2":
   version: 5.3.2
   resolution: "acorn-jsx@npm:5.3.2"
@@ -3857,6 +3866,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"enhanced-resolve@npm:^5.17.0":
+  version: 5.17.0
+  resolution: "enhanced-resolve@npm:5.17.0"
+  dependencies:
+    graceful-fs: ^4.2.4
+    tapable: ^2.2.0
+  checksum: 1066000454da6a7aeabdbe1f433d912d1e39e6892142a78a37b6577aab27e0436091fa1399d857ad87085b1c3b73a0f811c8874da3dbdc40fbd5ebe89a5568e6
+  languageName: node
+  linkType: hard
+
 "entities@npm:^4.2.0, entities@npm:^4.4.0":
   version: 4.5.0
   resolution: "entities@npm:4.5.0"
@@ -4981,7 +5000,7 @@ __metadata:
     ts-jest: ^29.1.2
     ts-loader: ^9.5.1
     typescript: ~5.3.3
-    webpack: ^5.90.0
+    webpack: ^5.93.0
     webpack-cli: ^5.1.4
   languageName: unknown
   linkType: soft
@@ -8382,7 +8401,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"webpack@npm:^5.76.1, webpack@npm:^5.90.0":
+"webpack@npm:^5.76.1":
   version: 5.91.0
   resolution: "webpack@npm:5.91.0"
   dependencies:
@@ -8419,6 +8438,43 @@ __metadata:
   languageName: node
   linkType: hard
 
+"webpack@npm:^5.93.0":
+  version: 5.93.0
+  resolution: "webpack@npm:5.93.0"
+  dependencies:
+    "@types/eslint-scope": ^3.7.3
+    "@types/estree": ^1.0.5
+    "@webassemblyjs/ast": ^1.12.1
+    "@webassemblyjs/wasm-edit": ^1.12.1
+    "@webassemblyjs/wasm-parser": ^1.12.1
+    acorn: ^8.7.1
+    acorn-import-attributes: ^1.9.5
+    browserslist: ^4.21.10
+    chrome-trace-event: ^1.0.2
+    enhanced-resolve: ^5.17.0
+    es-module-lexer: ^1.2.1
+    eslint-scope: 5.1.1
+    events: ^3.2.0
+    glob-to-regexp: ^0.4.1
+    graceful-fs: ^4.2.11
+    json-parse-even-better-errors: ^2.3.1
+    loader-runner: ^4.2.0
+    mime-types: ^2.1.27
+    neo-async: ^2.6.2
+    schema-utils: ^3.2.0
+    tapable: ^2.1.1
+    terser-webpack-plugin: ^5.3.10
+    watchpack: ^2.4.1
+    webpack-sources: ^3.2.3
+  peerDependenciesMeta:
+    webpack-cli:
+      optional: true
+  bin:
+    webpack: bin/webpack.js
+  checksum: c93bd73d9e1ab49b07e139582187f1c3760ee2cf0163b6288fab2ae210e39e59240a26284e7e5d29bec851255ef4b43c51642c882fa5a94e16ce7cb906deeb47
+  languageName: node
+  linkType: hard
+
 "whatwg-mimetype@npm:^2.3.0":
   version: 2.3.0
   resolution: "whatwg-mimetype@npm:2.3.0"