gridviz 3.0.5 → 3.0.7

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "gridviz",
-    "version": "3.0.5",
+    "version": "3.0.7",
     "description": "Visualization tool for gridded statistics",
     "keywords": [
         "statistics",

package/src/core/Legend.js

@@ -42,9 +42,9 @@ export class Legend {
         /** @type {string} @deprecated */
         this['font-family'] = opts['font-family'] || 'Helvetica, Arial, sans-serif'
         /** @type {string} @deprecated */
-        this.width = opts.width
+        //this.width = opts.width
         /** @type {string} @deprecated */
-        this.height = opts.height
+        //this.height = opts.height
 
         //the div element
         if (this.id) this.div = select('#' + this.id)
@@ -62,9 +62,8 @@ export class Legend {
         this.div.style('box-shadow', this['box-shadow'])
         this.div.style('font-family', this['font-family'])
 
-        if (this.width) this.div.style('width', this.width)
-        if (this.height) this.div.style('height', this.height)
-
+        //if (this.width) this.div.style('width', this.width)
+        //if (this.height) this.div.style('height', this.height)
 
         //title
         this.title = opts.title
@@ -93,9 +92,10 @@ export class Legend {
      * Apply a style to the legend div.
      * @param {string} k
      * @param {string} v
-     * @returns {this}
+     * @returns {this|string}
      */
     style(k, v) {
+        if (arguments.length == 1) return this.div.style(k)
         this.div.style(k, v)
         return this
     }

package/src/index.js

@@ -39,6 +39,7 @@ export { ImageStyle } from './style/ImageStyle.js'
 export { GridLayer } from './layer/GridLayer.js'
 export { BackgroundLayer } from './layer/BackgroundLayer.js'
 export { BackgroundLayerWMS } from './layer/BackgroundLayerWMS.js'
+export { BackgroundLayerImage } from './layer/BackgroundLayerImage.js'
 export { LabelLayer } from './layer/LabelLayer.js'
 export { GeoJSONLayer } from './layer/GeoJSONLayer.js'
 

package/src/layer/BackgroundLayerImage.js

@@ -0,0 +1,84 @@
+//@ts-check
+'use strict'
+
+import { Layer } from '../core/Layer.js'
+
+/**
+ *
+ * A map background layer composed of a single image file, geolocated.
+ * 
+ * @module layer
+ * @author Julien Gaffuri
+ */
+export class BackgroundLayerImage extends Layer {
+    /**
+     * @param {object} opts
+     */
+    constructor(opts) {
+        super(opts)
+        opts = opts || {}
+
+        /** The image file URL
+         * @type {string} */
+        this.url = opts.url
+
+        /** The image left coordinate
+         * @type {number} */
+        this.xMin = opts.xMin || 0;
+        /** The image top coordinate
+         *  @type {number} */
+        this.yMax = opts.yMax || 0;
+
+        /** The image width, in geo unit
+         * @type {number} */
+        this.width = opts.width || 20000
+        /** The image height, in geo unit
+         * @type {number} */
+        this.height = opts.height || 20000
+
+        /** The image object
+         * @type {HTMLImageElement|undefined} */
+        this.img = undefined;
+    }
+
+    /**
+     * @param {import("../core/GeoCanvas.js").GeoCanvas} geoCanvas The canvas where to draw the layer.
+     * @returns {void}
+     */
+    draw(geoCanvas) {
+
+        //update map extent
+        //geoCanvas.updateExtentGeo(0)
+
+        if (this.img) {
+            //the image was already downloaded: draw it
+
+            //compute screen coordinates and size ratio
+            const x = geoCanvas.geoToPixX(this.xMin)
+            const y = geoCanvas.geoToPixY(this.yMax)
+            const z = geoCanvas.getView().z
+
+            //draw image
+            geoCanvas.initCanvasTransform()
+            geoCanvas.ctx.drawImage(this.img, x, y, this.width / z, this.height / z)
+
+        } else {
+            //retrieve image
+
+            if (!this.img) {
+                this.img = new Image()
+                this.img.onload = () => {
+                    geoCanvas.redraw()
+                }
+                this.img.onerror = () => {
+                    //case when no image
+                    console.warn("Could not retrieve background image from", this.url)
+                }
+            }
+
+            //set URL to launch the download
+            this.img.src = this.url
+        }
+
+    }
+}