tileserver-gl-light 3.1.0 → 4.0.0

package/Dockerfile

@@ -1,4 +1,4 @@
-FROM node:10-stretch
+FROM node:16-bullseye
 
 ENV NODE_ENV="production"
 ENV CHOKIDAR_USEPOLLING=1
@@ -6,8 +6,9 @@ ENV CHOKIDAR_INTERVAL=500
 EXPOSE 80
 VOLUME /data
 WORKDIR /data
-ENTRYPOINT ["node", "/usr/src/app/", "-p", "80"]
+ENTRYPOINT ["/usr/src/app/docker-entrypoint.sh"]
 
 RUN mkdir -p /usr/src/app
 COPY / /usr/src/app
 RUN cd /usr/src/app && npm install --production
+RUN ["chmod", "+x", "/usr/src/app/docker-entrypoint.sh"]

package/Dockerfile_test

@@ -2,7 +2,7 @@
 # Simply run "docker build -f Dockerfile_test ."
 # WARNING: sometimes it fails with a core dumped exception
 
-FROM node:10-stretch
+FROM node:16-bullseye
 
 RUN apt-get -qq update \
 && DEBIAN_FRONTEND=noninteractive apt-get -y install \
@@ -17,6 +17,7 @@ RUN apt-get -qq update \
     libllvm3.9 \
     libprotobuf-dev \
     libxxf86vm-dev \
+    libopengl0 \
     xvfb \
 && apt-get clean
 

package/docker-entrypoint.sh

@@ -10,12 +10,24 @@ handle() {
 
 trap handle INT TERM
 
+refresh() {
+	SIGNAL=$(( $? - 128 ))
+	echo "Caught signal ${SIGNAL}, refreshing"
+	kill -s ${SIGNAL} $(pidof node) 2>/dev/null
+}
+
+trap refresh HUP
+
 if ! which -- "${1}"; then
   # first arg is not an executable
-  xvfb-run -a --server-args="-screen 0 1024x768x24" -- node /app/ "$@" &
+  node /usr/src/app/ -p 80 "$@" &
 	# Wait exits immediately on signals which have traps set. Store return value and wait
 	# again for all jobs to actually complete before continuing.
 	wait $! || RETVAL=$?
+	while [ ${RETVAL} = 129 ] ; do
+	  # Refressh signal HUP received. Continue waiting for signals.
+	  wait $! || RETVAL=$?
+	done
 	wait
 	exit ${RETVAL}
 fi

package/docs/conf.py

@@ -44,7 +44,7 @@ master_doc = 'index'
 
 # General information about the project.
 project = u'TileServer GL'
-copyright = u'2016, Klokan Technologies GmbH'
+copyright = u'2022, MapTiler.com'
 
 # The version info for the project you're documenting, acts as replacement for
 # |version| and |release|, also used in various other places throughout the
@@ -197,7 +197,7 @@ latex_elements = {
 #  author, documentclass [howto, manual, or own class]).
 latex_documents = [
   ('index', 'TileServerGL.tex', u'TileServer GL Documentation',
-   u'Klokan Technologies GmbH', 'manual'),
+   u'MapTiler.com', 'manual'),
 ]
 
 # The name of an image file (relative to this directory) to place at the top of
@@ -227,7 +227,7 @@ latex_documents = [
 # (source start file, name, description, authors, manual section).
 man_pages = [
     ('index', 'tileservergl', u'TileServer GL Documentation',
-     [u'Klokan Technologies GmbH'], 1)
+     [u'MapTiler.com'], 1)
 ]
 
 # If true, show URL addresses after external links.
@@ -241,7 +241,7 @@ man_pages = [
 #  dir menu entry, description, category)
 texinfo_documents = [
   ('index', 'TileServerGL', u'TileServer GL Documentation',
-   u'Klokan Technologies GmbH', 'TileServerGL', 'One line description of project.',
+   u'MapTiler.com', 'TileServerGL', 'One line description of project.',
    'Miscellaneous'),
 ]
 

package/docs/installation.rst

@@ -26,11 +26,30 @@ Native dependencies
 There are some native dependencies that you need to make sure are installed if you plan to run the TileServer GL natively without docker.
 The precise package names you need to install may differ on various platforms.
 
-These are required on Debian 9:
-  * ``build-essential``
+These are required on Debian 11:
+  * ``libgles2-mesa``
+  * ``libegl1``
+  * ``xvfb``
+  * ``xauth``
+  * ``libopengl0``
+  * ``libcurl4``
+  * ``curl``
+  * ``libuv1-dev``
+  * ``libc6-dev``
+  * ``http://archive.ubuntu.com/ubuntu/pool/main/libj/libjpeg-turbo/libjpeg-turbo8_2.0.3-0ubuntu1_amd64.deb``
+  * ``http://archive.ubuntu.com/ubuntu/pool/main/i/icu/libicu66_66.1-2ubuntu2_amd64.deb``
+
+These are required on Ubuntu 20.04:
   * ``libcairo2-dev``
-  * ``libprotobuf-dev``
-
+  * ``libjpeg8-dev``
+  * ``libpango1.0-dev``
+  * ``libgif-dev``
+  * ``build-essential``
+  * ``g++``
+  * ``xvfb``
+  * ``libgles2-mesa-dev``
+  * ``libgbm-dev``
+  * ``libxxf86vm-dev``
 
 ``tileserver-gl-light`` on npm
 ==============================

package/docs/usage.rst

@@ -29,8 +29,10 @@ Default preview style and configuration
 - If no configuration file is specified, a default preview style (compatible with openmaptiles) is used.
 - If no mbtiles file is specified (and is not found in the current working directory), a sample file is downloaded (showing the Zurich area)
 
-Reloading configuration
+Reloading the configuration
 ======
 
 It is possible to reload the configuration file without restarting the whole process by sending a SIGHUP signal to the node process.
-However, this does not currently work when running the tileserver-gl docker container (the signal is not passed to the subprocess, see https://github.com/maptiler/tileserver-gl/issues/420#issuecomment-597507663).
+
+- The `docker kill -s HUP tileserver-gl` command can be used when running the tileserver-gl docker container.
+- The `docker-compose kill -s HUP tileserver-gl-service-name` can be used when tileserver-gl is run as a docker-compose service.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tileserver-gl-light",
-  "version": "3.1.0",
+  "version": "4.0.0",
   "description": "Map tile server for JSON GL styles - serving vector tiles",
   "main": "src/main.js",
   "bin": "src/main.js",
@@ -18,23 +18,23 @@
   },
   "dependencies": {
     "@mapbox/glyph-pbf-composite": "0.0.3",
-    "@mapbox/mapbox-gl-style-spec": "13.12.0",
-    "@mapbox/mbtiles": "0.11.0",
-    "@mapbox/sphericalmercator": "1.1.0",
+    "@maplibre/maplibre-gl-style-spec": "17.0.1",
+    "@mapbox/mbtiles": "0.12.1",
+    "@mapbox/sphericalmercator": "1.2.0",
     "@mapbox/vector-tile": "1.3.1",
     "advanced-pool": "0.3.3",
-    "chokidar": "3.3.1",
+    "chokidar": "3.5.3",
     "clone": "2.1.2",
-    "color": "3.1.2",
-    "commander": "4.1.1",
+    "color": "4.2.3",
+    "commander": "9.4.0",
     "cors": "2.8.5",
     "esm": "3.2.25",
-    "express": "4.17.1",
-    "handlebars": "4.7.3",
+    "express": "4.18.1",
+    "handlebars": "4.7.7",
     "http-shutdown": "1.2.2",
-    "morgan": "1.9.1",
+    "morgan": "1.10.0",
     "pbf": "3.2.1",
-    "proj4": "2.6.0",
+    "proj4": "2.8.0",
     "request": "2.88.2",
     "tileserver-gl-styles": "2.0.0"
   }

package/public/resources/L.TileLayer.NoGap.js

@@ -0,0 +1,243 @@
+// @class TileLayer
+
+L.TileLayer.mergeOptions({
+	// @option keepBuffer
+	// The amount of tiles outside the visible map area to be kept in the stitched
+	// `TileLayer`.
+
+	// @option dumpToCanvas: Boolean = true
+	// Whether to dump loaded tiles to a `<canvas>` to prevent some rendering
+	// artifacts. (Disabled by default in IE)
+	dumpToCanvas: L.Browser.canvas && !L.Browser.ie,
+});
+
+L.TileLayer.include({
+	_onUpdateLevel: function(z, zoom) {
+		if (this.options.dumpToCanvas) {
+			this._levels[z].canvas.style.zIndex =
+				this.options.maxZoom - Math.abs(zoom - z);
+		}
+	},
+
+	_onRemoveLevel: function(z) {
+		if (this.options.dumpToCanvas) {
+			L.DomUtil.remove(this._levels[z].canvas);
+		}
+	},
+
+	_onCreateLevel: function(level) {
+		if (this.options.dumpToCanvas) {
+			level.canvas = L.DomUtil.create(
+				"canvas",
+				"leaflet-tile-container leaflet-zoom-animated",
+				this._container
+			);
+			level.ctx = level.canvas.getContext("2d");
+			this._resetCanvasSize(level);
+		}
+	},
+
+	_removeTile: function(key) {
+		if (this.options.dumpToCanvas) {
+			var tile = this._tiles[key];
+			var level = this._levels[tile.coords.z];
+			var tileSize = this.getTileSize();
+
+			if (level) {
+				// Where in the canvas should this tile go?
+				var offset = L.point(tile.coords.x, tile.coords.y)
+					.subtract(level.canvasRange.min)
+					.scaleBy(this.getTileSize());
+
+				level.ctx.clearRect(offset.x, offset.y, tileSize.x, tileSize.y);
+			}
+		}
+
+		L.GridLayer.prototype._removeTile.call(this, key);
+	},
+
+	_resetCanvasSize: function(level) {
+		var buff = this.options.keepBuffer,
+			pixelBounds = this._getTiledPixelBounds(this._map.getCenter()),
+			tileRange = this._pxBoundsToTileRange(pixelBounds),
+			tileSize = this.getTileSize();
+
+		tileRange.min = tileRange.min.subtract([buff, buff]); // This adds the no-prune buffer
+		tileRange.max = tileRange.max.add([buff + 1, buff + 1]);
+
+		var pixelRange = L.bounds(
+				tileRange.min.scaleBy(tileSize),
+				tileRange.max.add([1, 1]).scaleBy(tileSize) // This prevents an off-by-one when checking if tiles are inside
+			),
+			mustRepositionCanvas = false,
+			neededSize = pixelRange.max.subtract(pixelRange.min);
+
+		// Resize the canvas, if needed, and only to make it bigger.
+		if (
+			neededSize.x > level.canvas.width ||
+			neededSize.y > level.canvas.height
+		) {
+			// Resizing canvases erases the currently drawn content, I'm afraid.
+			// To keep it, dump the pixels to another canvas, then display it on
+			// top. This could be done with getImageData/putImageData, but that
+			// would break for tainted canvases (in non-CORS tilesets)
+			var oldSize = { x: level.canvas.width, y: level.canvas.height };
+			// console.info('Resizing canvas from ', oldSize, 'to ', neededSize);
+
+			var tmpCanvas = L.DomUtil.create("canvas");
+			tmpCanvas.style.width = (tmpCanvas.width = oldSize.x) + "px";
+			tmpCanvas.style.height = (tmpCanvas.height = oldSize.y) + "px";
+			tmpCanvas.getContext("2d").drawImage(level.canvas, 0, 0);
+			// var data = level.ctx.getImageData(0, 0, oldSize.x, oldSize.y);
+
+			level.canvas.style.width = (level.canvas.width = neededSize.x) + "px";
+			level.canvas.style.height = (level.canvas.height = neededSize.y) + "px";
+			level.ctx.drawImage(tmpCanvas, 0, 0);
+			// level.ctx.putImageData(data, 0, 0, 0, 0, oldSize.x, oldSize.y);
+		}
+
+		// Translate the canvas contents if it's moved around
+		if (level.canvasRange) {
+			var offset = level.canvasRange.min
+				.subtract(tileRange.min)
+				.scaleBy(this.getTileSize());
+
+			// 			console.info('Offsetting by ', offset);
+
+			if (!L.Browser.safari) {
+				// By default, canvases copy things "on top of" existing pixels, but we want
+				// this to *replace* the existing pixels when doing a drawImage() call.
+				// This will also clear the sides, so no clearRect() calls are needed to make room
+				// for the new tiles.
+				level.ctx.globalCompositeOperation = "copy";
+				level.ctx.drawImage(level.canvas, offset.x, offset.y);
+				level.ctx.globalCompositeOperation = "source-over";
+			} else {
+				// Safari clears the canvas when copying from itself :-(
+				if (!this._tmpCanvas) {
+					var t = (this._tmpCanvas = L.DomUtil.create("canvas"));
+					t.width = level.canvas.width;
+					t.height = level.canvas.height;
+					this._tmpContext = t.getContext("2d");
+				}
+				this._tmpContext.clearRect(
+					0,
+					0,
+					level.canvas.width,
+					level.canvas.height
+				);
+				this._tmpContext.drawImage(level.canvas, 0, 0);
+				level.ctx.clearRect(0, 0, level.canvas.width, level.canvas.height);
+				level.ctx.drawImage(this._tmpCanvas, offset.x, offset.y);
+			}
+
+			mustRepositionCanvas = true; // Wait until new props are set
+		}
+
+		level.canvasRange = tileRange;
+		level.canvasPxRange = pixelRange;
+		level.canvasOrigin = pixelRange.min;
+
+		// console.log('Canvas tile range: ', level, tileRange.min, tileRange.max );
+		// console.log('Canvas pixel range: ', pixelRange.min, pixelRange.max );
+		// console.log('Level origin: ', level.origin );
+
+		if (mustRepositionCanvas) {
+			this._setCanvasZoomTransform(
+				level,
+				this._map.getCenter(),
+				this._map.getZoom()
+			);
+		}
+	},
+
+	/// set transform/position of canvas, in addition to the transform/position of the individual tile container
+	_setZoomTransform: function(level, center, zoom) {
+		L.GridLayer.prototype._setZoomTransform.call(this, level, center, zoom);
+		if (this.options.dumpToCanvas) {
+			this._setCanvasZoomTransform(level, center, zoom);
+		}
+	},
+
+	// This will get called twice:
+	// * From _setZoomTransform
+	// * When the canvas has shifted due to a new tile being loaded
+	_setCanvasZoomTransform: function(level, center, zoom) {
+		// console.log('_setCanvasZoomTransform', level, center, zoom);
+		if (!level.canvasOrigin) {
+			return;
+		}
+		var scale = this._map.getZoomScale(zoom, level.zoom),
+			translate = level.canvasOrigin
+				.multiplyBy(scale)
+				.subtract(this._map._getNewPixelOrigin(center, zoom))
+				.round();
+
+		if (L.Browser.any3d) {
+			L.DomUtil.setTransform(level.canvas, translate, scale);
+		} else {
+			L.DomUtil.setPosition(level.canvas, translate);
+		}
+	},
+
+	_onOpaqueTile: function(tile) {
+		if (!this.options.dumpToCanvas) {
+			return;
+		}
+
+		// Guard against an NS_ERROR_NOT_AVAILABLE (or similar) exception
+		// when a non-image-tile has been loaded (e.g. a WMS error).
+		// Checking for tile.el.complete is not enough, as it has been
+		// already marked as loaded and ready somehow.
+		try {
+			this.dumpPixels(tile.coords, tile.el);
+		} catch (ex) {
+			return this.fire("tileerror", {
+				error: "Could not copy tile pixels: " + ex,
+				tile: tile,
+				coods: tile.coords,
+			});
+		}
+
+		// If dumping the pixels was successful, then hide the tile.
+		// Do not remove the tile itself, as it is needed to check if the whole
+		// level (and its canvas) should be removed (via level.el.children.length)
+		tile.el.style.display = "none";
+	},
+
+	// @section Extension methods
+	// @uninheritable
+
+	// @method dumpPixels(coords: Object, imageSource: CanvasImageSource): this
+	// Dumps pixels from the given `CanvasImageSource` into the layer, into
+	// the space for the tile represented by the `coords` tile coordinates (an object
+	// like `{x: Number, y: Number, z: Number}`; the image source must have the
+	// same size as the `tileSize` option for the layer. Has no effect if `dumpToCanvas`
+	// is `false`.
+	dumpPixels: function(coords, imageSource) {
+		var level = this._levels[coords.z],
+			tileSize = this.getTileSize();
+
+		if (!level.canvasRange || !this.options.dumpToCanvas) {
+			return;
+		}
+
+		// Check if the tile is inside the currently visible map bounds
+		// There is a possible race condition when tiles are loaded after they
+		// have been panned outside of the map.
+		if (!level.canvasRange.contains(coords)) {
+			this._resetCanvasSize(level);
+		}
+
+		// Where in the canvas should this tile go?
+		var offset = L.point(coords.x, coords.y)
+			.subtract(level.canvasRange.min)
+			.scaleBy(this.getTileSize());
+
+		level.ctx.drawImage(imageSource, offset.x, offset.y, tileSize.x, tileSize.y);
+
+		// TODO: Clear the pixels of other levels' canvases where they overlap
+		// this newly dumped tile.
+		return this;
+	},
+});